SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Extra space between nav in IE

    All browers are working correct on both Mac and PC, except IE on PC.

    There is extra space between the vertical nav. Thoughts?

    Code:
    #subnavwrapper {
    	width: 183px;
    }
    
    .dkgreen {
    	background-color: #5e6d2f;
    }
    
    #subnav {
    	width: 183px;
    }
    
    #subnav, #subnav ul {
    	padding: 0;
    	margin: 0;
    	list-style: none;
    	font-family: Times;
    }
    
    #subnav a {
    	display: block;
    	text-decoration: none;
    	padding: 7px 7px 7px 7px;
    	font-size: .7em;
    	color: #ffffff;
    }
    
    #subnav li {
    	width: 183px;
    	border-top: 1px solid #dcd7c5;
    }
    
    #subnav li.btm {
    	width: 183px;
    	border-bottom: 1px solid #dcd7c5;
    }
    
    #subnav li {position: relative;}
    
    /* hide from IE mac \*/
    #subnav li {position: static; width: auto;}
    /* end hiding from IE5 mac */
    
    #subnav ul li  {
    	width: 183px;
    }
    
    #subnav li:hover a, #subnav a:focus,
    #subnav a:active, #subnav li.hvr a {
    	color: #ffffff;
    	background-color: #867954;
    }
    
    #subnav ul a:hover {
    	background-color: #867954!important;
    	color: #ffffff !important;
    }

  2. #2
    Function Curry'er JimmyP's Avatar
    Join Date
    Aug 2007
    Location
    Brighton, UK
    Posts
    2,006
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Could you post some of the HTML markup please... or a link to the page maybe...?
    James Padolsey
    末末末末末末末末末末末末末末末末末末末
    Awesome JavaScript Zoomer (demo here)
    'Ajaxy' - Ajax integration solution (demo here)

  3. #3
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sure thing...

    Code:
            <div id="sidebar">
    				<div id="subnavwrapper">
    		<ul id="subnav">
    		<li><a href="" class="dkgreen">About Us</a></li>
    		<li><a href="">History</a></li>
    		<li><a href="">Joy Garden</a></li>
    		<li><a href="">Kara Leigh Pullley Park</a></li>
    		<li><a href="">Highlands Land Trust</a></li>
    		<li class="btm"><a href="">Sculpture on the Green</a></li>
    		</ul>
    		<br class="clearit">
    		</div>
    		
    		</div>
    Thanks!
    Quote Originally Posted by JimmyPaddy View Post
    Could you post some of the HTML markup please... or a link to the page maybe...?

  4. #4
    SitePoint Wizard bronze trophy DaveWoods's Avatar
    Join Date
    Dec 2004
    Location
    Derbyshire - UK
    Posts
    2,651
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The easiest way would be to give your <a>nchor "layout" by providing it with a width.

    Code:
    #subnav a {
    	display: block;
    	text-decoration: none;
    	padding: 7px 7px 7px 7px;
    	font-size: .7em;
    	color: #ffffff;
    	width: 169px;
    }

  5. #5
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That worked, sometimes its the simplest things. Thanks!

    What about getting the rollover (hover) to work?

    Quote Originally Posted by csswiz View Post
    The easiest way would be to give your <a>nchor "layout" by providing it with a width.

    Code:
    #subnav a {
    	display: block;
    	text-decoration: none;
    	padding: 7px 7px 7px 7px;
    	font-size: .7em;
    	color: #ffffff;
    	width: 169px;
    }

  6. #6
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Nevermind...I just used the same javascript workaround that I used with the top nav.

    Thank you.

    Quote Originally Posted by rancreative View Post
    That worked, sometimes its the simplest things. Thanks!

    What about getting the rollover (hover) to work?


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •