vincej Posted September 2, 2013 Share Posted September 2, 2013 Hi - I'm normally pretty good with css, but this time I am defeated. All I want is the white background behind the Navigation label extends right across the dropdown box. I have done the usual: checked the padding and margin. Also tried extending the width of the a tag and nothing works. When I make changes to these css selectors in Firebug they get crossed through. However, I can not see any other active value in the Firebug css listing which impacts the background color. Ok - you can not see the rest of the css style sheet, but under normal conditions what usually works given that each Nav label is slightly different in length ?? Many Many Thanks ! Quote Link to comment Share on other sites More sharing options...
fastsol Posted September 2, 2013 Share Posted September 2, 2013 Can we have a link to the page in question? Otherwise you'll need to provide the code so we can take a look. First guess is that you need to apply the background color to the <li> and not the <a>. Quote Link to comment Share on other sites More sharing options...
cyberRobot Posted September 3, 2013 Share Posted September 3, 2013 For the fly-out menu links (the bulletin, etc.), have you tried adding the "display:block;" declaration. You'll also need to define the width so the anchor tag doesn't exceed the underlying box. This should expand the clickable area so visitors don't need to click the text. Quote Link to comment Share on other sites More sharing options...
vincej Posted September 6, 2013 Author Share Posted September 6, 2013 Hi Guys - Many thanks for your advice so far. But sadly I continue to fail in getting it right. I have just today put the pre-production site up on a subdomain: http://parish.jacobssoftwareanddesign.com/ Can you have a look at the drop down "the parish" and see what stupid thing I am misssing on the sub menu - all I want is that the white background extends across the width of the dropdown when you hover over it. Many Many Thanks !! Quote Link to comment Share on other sites More sharing options...
Solution cyberRobot Posted September 6, 2013 Solution Share Posted September 6, 2013 (edited) Now I didn't look at all the CSS, but the menu seems to work with the following changes: Under ".dropdown-menu li a", add "width:205px;" Under "#menu a", change the text-align property to "left" Add a ".dropdown-menu li a:hover" option and add "width:205px;" Note that I don't know what that does with the rest of the website. You'll have some cleaning up to do...and some testing. Edited September 6, 2013 by cyberRobot Quote Link to comment Share on other sites More sharing options...
vincej Posted September 6, 2013 Author Share Posted September 6, 2013 YOU ARE A MEGA STAR - THANK YOU SO MUCH !! Part of my problem was that I was use % widths rather than an absolute width. So far I have not seen any adverse effects needing tidying up . Cheers ! Quote Link to comment Share on other sites More sharing options...
cyberRobot Posted September 6, 2013 Share Posted September 6, 2013 No problem, glad to help. Note that I marked the topic as solved. If you need further assistance, please mark it as unsolved or start a new thread. 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.