Using CSS to center images

[AmySueN]

Can CSS be used to center images? I tried the w3.org way and it doesn't work on my blog. I had been using the center html tag, but really want to use CSS.

[ScriptMan]

I cheat and use <p align="center"> when I am not floating them left or right.

I haven't looked at the wc site but I imagine a class in your CSS, something along the lines of:
p.center
{
text align: center;
}

would work. I am going to work on that some day soon. I just aren't a purist enough to have worried about it up until now. Let me if that works for you.

Tutor or Hades may jump in with the real solution.

[AmySueN]

Thanks, ScriptMan, I'll try that.

[HTMLBasicTutor]

Originally Posted by ScriptMan

I haven't looked at the wc site but I imagine a class in your CSS, something along the lines of:
p.center
{
text align: center;
}

I'd do it this way except without the p in front so you can use the center setting for other stuff too.

This one from W3C would more versatile than their first example:

IMG.displayed {
    display: block;
    margin-left: auto;
    margin-right: auto }
...
<IMG class="displayed" src="..." alt="...">

[HTMLBasicTutor]

Originally Posted by ncpfree

What is the best to minimize load type and server load?

Minimize the number of requests sent to the server. i.e. Number of times the browser has to go fetch something from the server.

Plan your CSS so there are a minimal number of individual styles used. Think recycle.

Combining elements with the same style saves on CSS file size but can be a bit confusing for someone new to CSS.

Making the style in one line instead of neatly spaced out in lines will save on CSS file size but again can be confusing for a beginner in CSS.

body {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 80%;
	background-color: #636954;
	margin: 0px;
	color: #000000;
}

vs

body {font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 80%; background-color: #636954; margin: 0px; color: #000000;}