Link to home
Start Free TrialLog in
Avatar of nsitedesigns
nsitedesignsFlag for United States of America

asked on

missing lines in nav bar

How do I add bottom border so that my tablet and mobile pages have a white line betwen nav buttons.  Right now, there is none.  I put red arrows in where I want white 1px border to appear.

http://screencast.com/t/fzLzpvIoV

http://nsitedesigns.com/nsitedesigns/wrb/test.html
Avatar of Gary
Gary
Flag of Ireland image

Add to .nav ul {}

border-bottom: 2px solid #FFFFFF;
Avatar of nsitedesigns

ASKER

I did add to screen_styles.css linke 72 and it display in desktop but not for tablet or phone.  I thought that if i DON'T make a note on changing something for a small or medium layout, that it will carry that design over to all 3 sizes.  Was I wrong?  Where did I mess up?


.nav ul {
    list-style: none;
    width: 9em;
	border-bottom: 1px solid #FFF;
}

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of Gary
Gary
Flag of Ireland image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
That fixed it.  What does  the >li mean?  That is a new css code that was provided to me.  I never used that before.
> means only immediate children.
If you had the following it would only apply to the LI's I've indicated as they are immediate children

<style>
ul > li {width:100px}
</style>

<ul>
     <li> // This is an immediate child of UL
          <ul>
               <li> // This is not a immediate child
               </li>
          </ul>
     </li>
     <li> // This is an immediate child of UL
     </li>
<ul>
man this coding can get complicated eh?  Thanks for the explanation!