Welcome to WebmasterWorld Guest from 54.167.58.159

Forum Moderators: not2easy

Message Too Old, No Replies

Centering links in DIV

     

Yoeri

7:21 pm on Jan 4, 2003 (gmt 0)

10+ Year Member



Hello,

Here's another problem I am struggling with ...

I have a menu that consists of a DIV with anchors in it.

HTML Example:
-------------
<DIV class="Menu">
<A class="MenuItem" href="">Menu Item 1</A>
<A class="MenuItem" href="">Menu Item 2</A>
</DIV>

Styles:
-------
DIV.Menu
{
width: 20%;
text-align: center;
}

A.MenuItem
{
width: 150px;
display: block;
text-align: left;
}

In IE, I get a menu with centered menu-items that are aligned left.

In mozilla, I get a menu with everything aligned left.

I guess that Mozilla doesn't allow a text-align center to align block elements within a div ...

How can I do this?

Thanks

madcat

8:53 pm on Jan 4, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Yoeri- Welcome to Webmaster World.

You should set the margins to auto anyway, text-align should be used for text.

A.MenuItem 
{
width: 150px;
display: block;
margin-left: auto;
margin-right: auto;
border: 1px solid #ccc;
text-align: left;
}

I think this is what you're trying to do. I put borders in to see what was happening.

Yoeri

11:05 am on Jan 5, 2003 (gmt 0)

10+ Year Member



Thanks

work like I want it :-)

Never used the auto value for the margins ... will take a look at what it exactly does .

Yoeri

11:22 am on Jan 5, 2003 (gmt 0)

10+ Year Member



I found another link in the forum that gives the solution ...

The text-align center is being used to center block alements in IE5 ... guess I am working to much with IE :)

[bluerobot.com ]