Hi all,

I have defined a div in which i wrote horizontal pipe links. Now, I want to center align this div. But Cudnt find anything to do that.

plz help me doing that.

I can't tell specifically what you want to do without any code, however, if you apply margin: auto; that should do what you need...

Andy

<div align="center">

Put that around the entire horizontal pipe links code

<div align="center">Link 1 | Link 2 | Link 3 | etc..</div>

That should do it

That's working on my site, I think it'll work on yours to.

<div class="menu-navigation">
<div id="navcontainer">
<ul id="navlist">
<li id="active"><a href="#" id="current">Item one</a></li>
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>
</ul>
</div>
</div>

.menu-navigation{
background:url(images/bg-menu.png) repeat-x;
margin:5px 0;
}
ul#navlist{
white-space: nowrap;
margin:5px 0;
line-height:3em;
}

#navlist li{
display: inline;
list-style-type: none;
margin:0;
}

#navlist a { padding: 3px 10px;}

#navlist a:link, #navlist a:visited{
color: #fff;
font-weight:bold;
font-size:12px;
text-decoration: none;
}

#navlist a:hover{
color: #000;
border:#330099 1px solid;
text-decoration: none;
}


Now, the links are showing to be left aligned. but i want it to be center aligned. when i use margin, it doesnt work without specifying width.

and when i specify fixed width, then when links will be added it will come in next line. But i want the links in one line n that too center aligned.

Hope these codes will be helpful.
[IMG]file:///C:/DOCUME%7E1/Romisha/LOCALS%7E1/Temp/moz-screenshot.jpg[/IMG]

.menu-navigation {
text-align:center;
background:url(images/bg-menu.png) repeat-x;
margin:5px 0;
}

Adding "text-align:center" achieved the result in FF and IE 7.

when you give margin-left and margin-right for a div ... it automatically gets centered !!!

No, it doesn't, not unless you SPECIFY A WIDTH first!!

but i want it to be center aligned. when i use margin:auto, it doesnt work without specifying width.

Ok, how do you expect the browser to center something when you've given it NOTHING to go on ? Without a dimension, what would it center against ? You MUST define a width for margin: auto to work!

Add text-align: center to #navlist ul, then add padding and/or margins to space out the <li> items.