PDA

View Full Version : CSS code style sheet - why wont it align centre?!


toffeeguitar
10-22-2011, 03:23 PM
Hi All,

Have created the below code for a horizontal menu bar which i want to be centered... please can you tell me what i need to add/change to make this work?

* { padding: 0; margin: 0; }
body { padding: 5px; font-family:Arial, Helvetica, sans-serif; font-size:12px }
ul { list-style: none }
ul li { float: left; padding-right: 1px; position: relative; }
ul a { display: table-cell; vertical-align: middle; width: 186px; height: 30px; text-align: center; color: #666; text-decoration: none; }
ul a:hover { color: #000; background-image:url(../images/menu-selected.jpg) }
li > ul { display: none; position:absolute; left: 0; top: 100%; }
li:hover > ul { display: block; color: #000; background-image:url(../images/menu-hover.jpg); }
li > ul li { padding: 0; padding-top: 1px; }
li > ul li > ul { left: 100%; top: 0; padding-left: 1px; }
li > ul li > ul li { width: 186px; }
li:hover > a { color: #000; background-image:url(../images/menu-selected.jpg); }
</style>

Thanks,

Joe

DWcourse
10-22-2011, 06:12 PM
You can center an html object with CSS by giving it a width and setting the left and right margins to auto.

However, which object you choose to center, will depend on the rest of your page layout.

toffeeguitar
10-22-2011, 09:10 PM
Sorry, im a bit of a newb when it comes to this...

Can you give me step by step details please? I have attached my files incase its easier for you to edit!?!

Thanks so much.

DWcourse
10-22-2011, 09:43 PM
Sorry, most people won't open posted zip files because of security issues. In any case here's a video that might help: http://www.dwcourse.com/dreamweaver/centering-a-web-layout.php

toffeeguitar
10-22-2011, 10:21 PM
Thanks, will have a look at that

toffeeguitar
10-22-2011, 11:56 PM
worked a treat! thank you!