Center image in DIV?

N

Noozer

Why are there no alignment properties that I can use to align an image
within a div?

We haven't finalize our logo so we don't know the final width of the image.
CSS is supposed to be about layout, not content, so the dimensions shouldn't
come into play when defining the style sheet anyhow. At this point we are
going to have to use the <CENTER> tag.

How do I define that any IMG tag should be centered?

P.s. I didn't see any groups dedicated to CSS. Please let me know if there
are any.
 
B

brucie

Why are there no alignment properties that I can use to align an image
within a div?
whatever{text-align:center:}

We haven't finalize our logo so we don't know the final width of the image.
CSS is supposed to be about layout, not content, so the dimensions shouldn't
come into play when defining the style sheet anyhow.

that doesn't make sense
P.s. I didn't see any groups dedicated to CSS. Please let me know if there
are any.

comp.infosystems.www.authoring.stylesheets
 
M

Mark Parnell

[alt.discuss.html trimmed as it doesn't exist on my news server]
Why are there no alignment properties that I can use to align an image
within a div?

There is. An image is inline content, so text-align is the one you are
looking for.
We haven't finalize our logo so we don't know the final width of the image.
CSS is supposed to be about layout, not content, so the dimensions shouldn't
come into play when defining the style sheet anyhow. At this point we are
going to have to use the <CENTER> tag.

Bah! Deprecated rubbish.
How do I define that any IMG tag should be centered?

text-align: center;
P.s. I didn't see any groups dedicated to CSS. Please let me know if there
are any.

news:comp.infosystems.www.authoring.stylesheets :)
 
N

Noozer

We haven't finalize our logo so we don't know the final width of the
image.
that doesn't make sense

What I mean is that all the solutions that I found needed to know the
dimensions of the image being centered, so the CSS was bound to the specific
content, not just the page layout. CSS is supposed to be about layout, not
content.

The text-align works fine (although doesn't really make much sense, since
this isn't text.)
 
B

brucie

Had to set Display: Block; to get it to work though.

thats a bit odd, a div with text-align:center; will center an image
without having to do anything else.
 
M

Mark Parnell

The text-align works fine (although doesn't really make much sense, since
this isn't text.)

But an image is still inline content. Though you said that you had to
specify display: block; on it, which makes it not inline content.

Let me guess: you are using Internet Explorer to test. Probably in
"quirks" mode. Internet Explorer is broken. You shouldn't use it as your
primary test browser.

More info on centring:
http://dorward.me.uk/www/centre/
 
N

Noozer

Mark Parnell said:
But an image is still inline content. Though you said that you had to
specify display: block; on it, which makes it not inline content.

Let me guess: you are using Internet Explorer to test. Probably in
"quirks" mode. Internet Explorer is broken. You shouldn't use it as your
primary test browser.

I know what you mean... It's not my test browser though, it's my target
browser.

I think that the W3C (or whoever makes the rules for CSS) should develop a
common rendering/interpretation engine that the browser makes could include
in their builds. This would ensure 100% compliance.
 
W

William Tasso

Noozer said:
...
I think that the W3C (or whoever makes the rules for CSS) should
develop a common rendering/interpretation engine that the browser
makes could include in their builds. This would ensure 100%
compliance.

Good plan - and you called brucie a nazi - go for it ;o)
 
L

Leif K-Brooks

Noozer said:
I think that the W3C (or whoever makes the rules for CSS) should develop a
common rendering/interpretation engine that the browser makes could include
in their builds. This would ensure 100% compliance.

Wouldn't work, since most browser makers wouldn't use it. Every browser
could give up their rendering engines and switch to KHTML or Gecko right
now, but they don't.
 
T

Toby A Inkster

brucie said:
thats a bit odd, a div with text-align:center; will center an image
without having to do anything else.

I think he's using

img { text-align: center; display: block; }
 
T

Toby A Inkster

Noozer said:
I think that the W3C (or whoever makes the rules for CSS) should develop a
common rendering/interpretation engine

They have. It's called Amaya.
that the browser makes could include in their builds.

They can, but they don't.
This would ensure 100% compliance.

Which is why it hasn't.
 
R

rf

Noozer said:
I think that the W3C (or whoever makes the rules for CSS) should develop a
common rendering/interpretation engine that the browser makes could include
in their builds. This would ensure 100% compliance.

Now there is a very good idea...

if it were not just so hilarious :)

Cheers
Richard.
 
D

DU

Noozer said:
I know what you mean... It's not my test browser though, it's my target
browser.

I think that the W3C (or whoever makes the rules for CSS) should develop a
common rendering/interpretation engine that the browser makes could include
in their builds. This would ensure 100% compliance.

Just a few remarks about your previous posts including this one.

1- Internet Explorer 6 for windows is not broken or anything as long as
the page triggers standards compliant rendering mode. MSIE 6 for windows
is admittedly not perfect. But it will correct many compliance issues,
matters (namely its CSS1 box model for which developers have been
complaining about during several years) when it is triggered into the
standards compliance rendering mode. You are strongly encouraged to use
a strict definition for your markup code, of course to use a doctype
declaration and to validate your markup and CSS code.

2- 100% compliance among browsers is an utopia. Most browser
manufacturers/organizations (like Mozilla.org, Opera, etc.) are still
striving to support all HTML 4.01 elements and attributes and they still
have not.

3- You are right in my opinion when you suggest that text-align is
misleading. If the whole TR had to be re-written, I would vote for
inline-alignment instead or something like that.

DU
 
D

DU

Leif said:
Wouldn't work, since most browser makers wouldn't use it. Every browser
could give up their rendering engines and switch to KHTML or Gecko right
now, but they don't.

MyIE2 has. I've been using Mozilla 1.5 as the rendering engine for MyIE2
for over 3 weeks now. I think such flexibility and interoperability was
the greatest news in the browser market in 2003.

DU
 
M

Michael Fesser

DU said:
1- Internet Explorer 6 for windows is not broken or anything as long as
the page triggers standards compliant rendering mode.

Even then too many things are missing or broken (min/max-width, :before,
:after, :hover on elements other than anchors, margin: auto, background-
position when used with background-attachment: fixed, child-/attribute-
and many other selectors, <q>, PNG-support, ...).

Micha
 
T

Toby A Inkster

DU said:
MyIE2 has. I've been using Mozilla 1.5 as the rendering engine for MyIE2
for over 3 weeks now. I think such flexibility and interoperability was
the greatest news in the browser market in 2003.

I believe Neoplanet also allows you to use Gecko now. And there's a Gecko
patch for Konqueror. Nautilus 1.x allowed you to switch between GtkHTML
and Gecko, but Nautilus 2.x is strictly GtkHTML only.
 
S

Steve Sundberg

What I mean is that all the solutions that I found needed to know the
dimensions of the image being centered, so the CSS was bound to the specific
content, not just the page layout. CSS is supposed to be about layout, not
content.

That's no different than a designer, laying out a page, having to
block out an finite space alongside a column of copy. That is very
much about layout and has nothing to do with any text content.

The text-align works fine (although doesn't really make much sense, since
this isn't text.)

Well, in a sense it is textural -- in that you're including the image
within the body you've created as a <div>.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,731
Messages
2,569,432
Members
44,835
Latest member
KetoRushACVBuy

Latest Threads

Top