gratsami Posted December 7, 2008 Share Posted December 7, 2008 Hello i tried in css to align my horizental menu to center but failed my test in attachs ... i wanna to make my menu in the center ... notes: the links increase or decrease. thanks [attachment deleted by admin] Link to comment https://forums.phpfreaks.com/topic/135867-how-to-align-horizental-menu-in-center/ Share on other sites More sharing options...
dropfaith Posted December 7, 2008 Share Posted December 7, 2008 i didnt check your code but adding text-align:center; to the ul elemant should center it or margin:0 auto to the sAME ELEMENT should work i think Link to comment https://forums.phpfreaks.com/topic/135867-how-to-align-horizental-menu-in-center/#findComment-708240 Share on other sites More sharing options...
gratsami Posted December 7, 2008 Author Share Posted December 7, 2008 i didnt check your code but adding text-align:center; to the ul elemant should center it or margin:0 auto to the sAME ELEMENT should work i think i traid that ... the problem cause all (li) float: left... can you check at my code please.. maybe there is a wrong in my code.. thank you bro. Link to comment https://forums.phpfreaks.com/topic/135867-how-to-align-horizental-menu-in-center/#findComment-708243 Share on other sites More sharing options...
dropfaith Posted December 7, 2008 Share Posted December 7, 2008 why are they all floated left is this a drop menu?or just a nav bar Link to comment https://forums.phpfreaks.com/topic/135867-how-to-align-horizental-menu-in-center/#findComment-708248 Share on other sites More sharing options...
dropfaith Posted December 7, 2008 Share Posted December 7, 2008 to avoid forcing people to download it hers the full code for testing this i will be back later to fix it if nobody else has got some things to do <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <style type="text/css"> body { background: #FFF; font-size: 9pt; font-family: Tahoma, arial, sans-serif; color: #333; text-align: center; margin: 0; padding: 0; } a{ text-decoration: none;} a:visited{ text-decoration: none;} a:hover { text-decoration: none;} #centeralignment{ width: 930px; height: 27px; border: #333 1px solid; text-align: center; } #nav { margin: 0; padding: 0; list-style-type: none; text-align: center; display: block; } #nav ul{ text-align: center; } #nav li { margin: 0; padding: 0; float: left; text-align: center; } #nav a { float: left; width: 111px; line-height: 27px; color: #455B80; text-decoration: none; font-family:arial; font-size:16px; font-weight:bold; text-align: center; background: url(headbuttonnormal.gif) no-repeat; } #nav a:hover { float: left; width: 111px; line-height: 27px; color: #455B80; text-decoration: none; font-family:arial; font-size:16px; font-weight:bold; text-align: center; background: url(headbuttonhover.gif) no-repeat; } </style> </head> <body> <div id="centeralignment"> <ul id="nav"> <li id="nav_1"><a href="#">LINK#1</a></li> <li id="nav_2"><a href="#">LINK#2</a></li> <li id="nav_3"><a href="#">LINK#3</a></li> <li id="nav_4"><a href="#">LINK#4</a></li> <li id="nav_5"><a href="#">LINK#5</a></li> <li id="nav_5"><a href="#">LINK#6</a></li> <li id="nav_6"><a href="#">LINK#7</a></li> </ul> </div> </body> </html> Link to comment https://forums.phpfreaks.com/topic/135867-how-to-align-horizental-menu-in-center/#findComment-708249 Share on other sites More sharing options...
sKunKbad Posted December 7, 2008 Share Posted December 7, 2008 Centering a horizontal menu sometimes requires using display:table and display:table-cell. Search around Google or Yahoo and you will see how this is used. Link to comment https://forums.phpfreaks.com/topic/135867-how-to-align-horizental-menu-in-center/#findComment-708368 Share on other sites More sharing options...
gratsami Posted December 7, 2008 Author Share Posted December 7, 2008 Centering a horizontal menu sometimes requires using display:table and display:table-cell. Search around Google or Yahoo and you will see how this is used. Thanks bro. i'll search about it Link to comment https://forums.phpfreaks.com/topic/135867-how-to-align-horizental-menu-in-center/#findComment-708371 Share on other sites More sharing options...
ifubad Posted December 7, 2008 Share Posted December 7, 2008 You can't center a floated element easily, try the following http://pmob.co.uk/pob/centred-float.htm Next x, instead of attaching a zip, just paste part of the code. Link to comment https://forums.phpfreaks.com/topic/135867-how-to-align-horizental-menu-in-center/#findComment-708669 Share on other sites More sharing options...
gratsami Posted December 8, 2008 Author Share Posted December 8, 2008 You can't center a floated element easily, try the following http://pmob.co.uk/pob/centred-float.htm Next x, instead of attaching a zip, just paste part of the code. thank you bro. i'll try this example Regards Link to comment https://forums.phpfreaks.com/topic/135867-how-to-align-horizental-menu-in-center/#findComment-709253 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.