Topic: NN4 and centring Div's (Page 1 of 1)

Hi Guy's how's it going?

I'm wondering if there's a way to position a Div in the centre of a page with NN4, I've tried margin:auto; text-align:centre; but these don't seem to work, even align="centre". I was wondering if there was a clever hack or something that could take care of it?

Cheers,

Blaise

You have to use the american-english spelling of "center" =)

ooh, I didn't notice that!

Well actually I have checked that before I guess I just types centre like that on this post.

so I've tried using center aswell but still left aligned for me

Blaise: Depending on the mood of NN4 and the inner guts of your page, the negative margin hack may do the trick. For instance:

#idOfYourDiv

{

    position:absolute;

    left:50%;

    width:300px;

    margin-left:-150px; // minus half the width of the Div

}

Hope that helps

Mathieu "POÏ" HENRI

Poi: For a thing like horizontal centering, that might actually cause more troubles than it solves (vertical centering is mostly what it's good for, IMO).

Blaise: Can you give us a link to the page demonstrating the problem?

Before we give any more thought to this, one VERY important question:

Why does this have to work in NN4?

If there's a good reason, then there is a good probability that the answer will involve something other than <div>'s and CSS.....seeing as NN4 is notorious for it's very poor support of such things.

If there is not a good reason...then forget all about it....

Perhaps one good reason is that I'm being told it has to?

If I had it my way I wouldn't even look to see if a website worked in NN4 I couldn't care less. except for the fact that this time the powers that be want it that way, so unfortunatly it has to.

I want to create a page using CSS for layout and style as much as possible, and one thing (which I thought would be extremely simple to do) I would liek is to centre the contents of my page without using a table design.

Blaise

It's definitely possible with text-align:center . I think you have to apply it to the *containing* element, not the element you want to center.

You can then override it in other browsers with this NN4 CSS-hiding trick:

/*/*/
text-align:left;
/* */