mikemastah Posted December 24, 2008 Share Posted December 24, 2008 I have a problem with my tab menubar. in most browsers it looks like this: in some others it looks like this but this is what i want this is more or less the css I use: .menuhold { background-color: #17130f; width: 846px; height: 40px !important; } .menubar ul { list-style: none; padding: 0; margin-top: 6px; margin-bottom: -2px; } .menubar li { float: left; margin: 0 2px; } .menubar li a { background: url('/images/tab2.png') no-repeat; height: 36px; line-height: 2em; float: left; width: 96px; display: block; color: #a39a7b; text-decoration: none; text-align: center; } .menubar li a:hover, .menubar li a.current { color: #17130f; font-weight: bold; background: url('/images/tab.png') no-repeat; height: 36px; width: 96px; } menuhold being the div which holds the menu.... wow that sounds.... anyways can anyone help me? Quote Link to comment Share on other sites More sharing options...
TorchPro Posted February 18, 2009 Share Posted February 18, 2009 Re: Tab menu problem Try using the float option for the css.. Maybe that would work And I noticed that when I do divs as well, you should use advanced selectors.. But, I noticed that same crap happening when I open up work in chrome or something like that. Dont know what the problem is, but I would just put some text at the top or the bottom of the page saying best viewed in whatever browser you think it looks best in. Quote Link to comment Share on other sites More sharing options...
POG1 Posted February 18, 2009 Share Posted February 18, 2009 Re: Tab menu problem Try adding this into the container div. overflow:hide; Quote Link to comment Share on other sites More sharing options...
Floydian Posted February 18, 2009 Share Posted February 18, 2009 Re: Tab menu problem It's really impossible to know for sure what the solution is without a test case. Put up a link to the site and I or someone else would be able to provide a definitive answer. With that said, I wonder if a text-align is being set to center for some reason. Quote Link to comment Share on other sites More sharing options...
POG1 Posted February 22, 2009 Share Posted February 22, 2009 Re: Tab menu problem Try this.. <html> <head> <style type="text/CSS"> body {background:#a39a7b;font-family: Sans,"microsoft sans serif",sans-serif,arial;font-size: 0.9em;} #menu { margin:0;padding:0;background:url([url]http://armybattleground.co.cc/images/tab2.png[/url]);height:36px;overflow:hidden } #menu ul { margin:0;padding:0;height:36px; } #menu ul li { margin:0;padding:0;float:left;display:block;height:36px; } #menu ul li a { padding-top:5px;font-weight:bold;margin:0;padding:height:36px;line-height:2em;float:left;width:96px;display:block;color:#a39a7b;text-decoration:none;text-align:center;} #menu ul li a:hover, #menu ul li a.current { height:36px;background:url([url]http://armybattleground.co.cc/images/tab.png[/url]);color:#17130f;font-weight: bold; } .clear{clear:both} </style> </head> <body> <div id="menu"> <ul> [*][url="#"]Home[/url] [*][url="#"]Home[/url] [*][url="#"]Home[/url] [*][url="#"]Home[/url] <br class="clear" /> [/list] </div> </body> </html> Quote Link to comment Share on other sites More sharing options...
mikemastah Posted February 25, 2009 Author Share Posted February 25, 2009 Re: Tab menu problem thanks a lot POG, works like a charm. fixed it now. Quote Link to comment Share on other sites More sharing options...
POG1 Posted February 25, 2009 Share Posted February 25, 2009 Re: Tab menu problem Ok cool :) Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.