treehouse : what would you like to learn today?
Web Design Web Development iOS Development

CSS Dropdown span messing up link

  • Hi, im currently working on a website for a client, and i was able to set up a nav with a drop down menu. if you hover over the "services" link you'll see that the 2nd drop down list item is 2 lines, i had to break the line within the list item to make it fit and i used a span to add a negative margin because the break moved it over somehow. its lined up the way i want it but now the 2nd line is too bold and im guessing it has something to do with the span and i cant seem to fix it, any help would be appreciated.

    the link is:
    http://www.marenastudios.com/client1/es ... /index.php
  • Here you go:
    .dropdown-indent {
    clear:both;
    font-weight:lighter;
    margin-left:-11px;
    }
  • tried that, it makes it lighter than the rest of the nav and throws off the margin
  • got it, i just added the span before the text instead of around it so that it still moves it over but doesnt effect the font weight

    .dropdown-indent {
    margin-left:-20px;
    }

    <li><a href="construction.php" class="construction">general contracting, construction management<br /><span class="dropdown-indent"></span>owner's representative and sub contracting</a></li>