Solved

missing lines in nav bar

Posted on 2013-11-26
6
265 Views
Last Modified: 2013-11-26
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
0
Comment
Question by:nsitedesigns
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 3
6 Comments
 
LVL 58

Expert Comment

by:Gary
ID: 39679186
Add to .nav ul {}

border-bottom: 2px solid #FFFFFF;
0
 

Author Comment

by:nsitedesigns
ID: 39679206
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

0
 
LVL 58

Accepted Solution

by:
Gary earned 500 total points
ID: 39679214
My bad it should be .nav > li {}
Line 132 again.
0
Salesforce Made Easy to Use

On-screen guidance at the moment of need enables you & your employees to focus on the core, you can now boost your adoption rates swiftly and simply with one easy tool.

 

Author Comment

by:nsitedesigns
ID: 39679268
That fixed it.  What does  the >li mean?  That is a new css code that was provided to me.  I never used that before.
0
 
LVL 58

Expert Comment

by:Gary
ID: 39679285
> 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>
0
 

Author Comment

by:nsitedesigns
ID: 39679293
man this coding can get complicated eh?  Thanks for the explanation!
0

Featured Post

On Demand Webinar - Networking for the Cloud Era

This webinar discusses:
-Common barriers companies experience when moving to the cloud
-How SD-WAN changes the way we look at networks
-Best practices customers should employ moving forward with cloud migration
-What happens behind the scenes of SteelConnect’s one-click button

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

An enjoyable and seamless user experience can go a long way on an eCommerce site. While a cohesive layout and engaging copy play roles in creating a positive user experience, some sites neglect aspects that seem marginal but in actuality prove very …
Developer portfolios can be a bit of an enigma—how do you present yourself to employers without burying them in lines of code?  A modern portfolio is more than just work samples, it’s also a statement of how you work.
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.
The is a quite short video tutorial. In this video, I'm going to show you how to create self-host WordPress blog with free hosting service.

739 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question