Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Feb 2008
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    FF works, but my nested list floats off the right of the page in IE

    #locations_c {
    padding-top:20px;
    }

    #locations {
    width:880px;
    }
    #locations ul {
    list-style-type:none;
    width:293px;
    }
    #locations ul li {
    width:293px;
    text-decoration:none;
    }
    #locations ul li ul {
    width:273px;
    }
    #locations ul li ul li {
    padding-left:20px;
    }
    #locations ul li ul li ul {
    }
    #locations ul li ul li ul li {
    width:253px;
    }
    #locations a {
    font-family:arial;
    font-size:11px;
    width:253px;
    text-decoration:none;
    color:#000000;
    }

    #locations a:visted {
    color:#000000;
    }

    #locations a:hover {
    color:#ba0000;
    }



    <div id="locations_c">
    <div id="locations">
    <ul>
    <li><a href="#">Sacramento &amp; Roseville Area</a>
    <ul>
    <li><a href="#">Roseville</a>
    <ul>
    <li><a href="#">Holiday Inn Express &amp; Suites </a></li>
    <li><a href="#">Orchid Suites </a></li>
    <li><a href="#">Best Western Roseville Inn</a></li>
    <li><a href="#">Heritage Inn Express </a></li>
    </ul>
    </li>
    <li><a href="#">Rancho Cordova </a>
    <ul>
    <li><a href="#">Best Western Venetian Court</a></li>
    </ul>
    </li>
    <li><a href="#">Rocklin </a>
    <ul>
    <li><a href="#">Heritage Inn Express, Rocklin </a></li>
    </ul>
    </li>
    <li><a href="#">Vacaville</a>
    <ul>
    <li><a href="#">Best Western Heritage Inn</a></li>
    </ul>
    </li>
    </ul>
    </li>
    </ul>
    <ul>
    <li><a href="#">Greater Bay Area</a>
    <ul>
    <li><a href="#">Concord</a>
    <ul>
    <li><a href="#">Best Western Heritage Inn </a></li>
    </ul>
    </li>
    <li><a href="#">Benicia</a>
    <ul>
    <li><a href="#">Best Western Heritage Inn </a></li>
    </ul>
    </li>
    <li><a href="#">Antioch</a>
    <ul>
    <li><a href="#">Best Western Heritage Inn </a></li>
    </ul>
    </li>
    <li><a href="#">Martinez</a>
    <ul>
    <li><a href="#">Best Western John Muir Inn </a></li>
    </ul>
    </li>
    <li><a href="#">Grass Valley &amp; Nevada Union</a>
    <ul>
    <li><a href="#">BW Gold Country Inn Grass Valley</a></li>
    <li><a href="#">Nevada City Inn Nevada City</a></li>
    </ul>
    </li>
    </ul>
    </li>
    </ul>
    <ul>
    <li><a href="#">Chico Area</a>
    <ul>
    <li><a href="#">Chico</a>
    <ul>
    <li><a href="#">Best Western Heritage Inn Chico</a></li>
    <li><a href="#">Heritage Inn</a></li>
    </ul>
    </li>
    </ul>
    </li>
    </ul>
    <ul>
    <li><a href="#">San Francisco Bay Area</a>
    <ul>
    <li><a href="#">Santa Rosa</a>
    <ul>
    <li><a href="#">Holiday Inn Express Santa Rosa</a></li>
    </ul>
    </li>
    <li><a href="#">Oakland</a>
    <ul>
    <li><a href="#">La Quinta Inn Oakland</a></li>
    </ul>
    </li>
    </ul>
    </li>
    </ul>
    <ul>
    <li><a href="#">Sonora Area</a>
    <ul>
    <li><a href="#">Sonora</a>
    <ul>
    <li><a href="#">Best Western Sonora Oaks</a></li>
    <li><a href="#">Inns of California</a></li>
    </ul>
    </li>
    </ul>
    </li>
    </ul>
    </div>
    </div>


    In FF, the last two lists stack under the 3rd.

    In IE the last two overflow on the right of the page.

    Help would be much appreciated thanks!

  • #2
    Senior Coder jcdevelopment's Avatar
    Join Date
    Oct 2007
    Location
    Cowboy Nation
    Posts
    2,182
    Thanks
    174
    Thanked 257 Times in 257 Posts
    do you have maybe a screen shot of what its doing?

    other than that i will work on it and see what its doing!

    edit*

    ok i just took a look at it and it looks fine tom me, perhaps its something else that is causing it.. here is what i have

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    #locations_c {
    padding-top:20px;
    }
    
    #locations {
    width:880px;
    }
    #locations ul {
    list-style-type:none;
    width:293px;
    }
    #locations ul li {
    width:293px;
    text-decoration:none;
    }
    #locations ul li ul {
    width:273px;
    }
    #locations ul li ul li {
    padding-left:20px;
    }
    #locations ul li ul li ul {
    }
    #locations ul li ul li ul li {
    width:253px; 
    }
    #locations a {
    font-family:arial;
    font-size:11px;
    width:253px;
    text-decoration:none;
    color:#000000;
    }
    
    #locations a:visted {
    color:#000000; 
    }
    
    #locations a:hover {
    color:#ba0000;
    }
    
    
    </style>
    
    </head>
    
    <body>
    
    <div id="locations_c">
    <div id="locations">
    <ul>
    <li><a href="#">Sacramento &amp; Roseville Area</a>
    <ul>
    <li><a href="#">Roseville</a>
    <ul>
    <li><a href="#">Holiday Inn Express &amp; Suites </a></li>
    <li><a href="#">Orchid Suites </a></li>
    <li><a href="#">Best Western Roseville Inn</a></li>
    <li><a href="#">Heritage Inn Express </a></li>
    </ul>
    </li>
    <li><a href="#">Rancho Cordova </a>
    <ul>
    <li><a href="#">Best Western Venetian Court</a></li>
    </ul>
    </li>
    <li><a href="#">Rocklin </a>
    <ul>
    <li><a href="#">Heritage Inn Express, Rocklin </a></li>
    </ul>
    </li>
    <li><a href="#">Vacaville</a>
    <ul>
    <li><a href="#">Best Western Heritage Inn</a></li>
    </ul>
    </li>
    </ul>
    </li>
    </ul>
    <ul> 
    <li><a href="#">Greater Bay Area</a>
    <ul>
    <li><a href="#">Concord</a>
    <ul>
    <li><a href="#">Best Western Heritage Inn </a></li>
    </ul>
    </li>
    <li><a href="#">Benicia</a>
    <ul>
    <li><a href="#">Best Western Heritage Inn </a></li>
    </ul>
    </li>
    <li><a href="#">Antioch</a>
    <ul>
    <li><a href="#">Best Western Heritage Inn </a></li>
    </ul>
    </li>
    <li><a href="#">Martinez</a>
    <ul>
    <li><a href="#">Best Western John Muir Inn </a></li>
    </ul>
    </li>
    <li><a href="#">Grass Valley &amp; Nevada Union</a>
    <ul>
    <li><a href="#">BW Gold Country Inn Grass Valley</a></li>
    <li><a href="#">Nevada City Inn Nevada City</a></li>
    </ul>
    </li>
    </ul>
    </li>
    </ul>
    <ul> 
    <li><a href="#">Chico Area</a>
    <ul>
    <li><a href="#">Chico</a>
    <ul>
    <li><a href="#">Best Western Heritage Inn Chico</a></li>
    <li><a href="#">Heritage Inn</a></li>
    </ul>
    </li>
    </ul>
    </li>
    </ul>
    <ul> 
    <li><a href="#">San Francisco Bay Area</a>
    <ul>
    <li><a href="#">Santa Rosa</a>
    <ul>
    <li><a href="#">Holiday Inn Express Santa Rosa</a></li>
    </ul>
    </li>
    <li><a href="#">Oakland</a>
    <ul>
    <li><a href="#">La Quinta Inn Oakland</a></li>
    </ul>
    </li>
    </ul>
    </li>
    </ul>
    <ul> 
    <li><a href="#">Sonora Area</a>
    <ul>
    <li><a href="#">Sonora</a>
    <ul>
    <li><a href="#">Best Western Sonora Oaks</a></li>
    <li><a href="#">Inns of California</a></li>
    </ul>
    </li>
    </ul>
    </li>
    </ul>
    </div>
    </div>
    
    
    
    
    </body>
    </html>
    Last edited by jcdevelopment; 02-27-2008 at 08:13 PM. Reason: saw it

  • #3
    Senior Coder jerry62704's Avatar
    Join Date
    Oct 2007
    Location
    Springfield, IL
    Posts
    1,100
    Thanks
    13
    Thanked 87 Times in 87 Posts
    Just a FYI. Click the "#" button on the editor bar and you will get paired code tags in the post. Put your code in it and you will have a much smaller vertical footprint and a scrollable window in the post.
    .
    .
    ...and gladly would he learn and gladly teach

    Visit www.LiberalsWin.com for humor and the unique Bush/Obama Approval Polls

  • #4
    New to the CF scene
    Join Date
    Feb 2008
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Code:
    #locations_c {
    	padding-top:20px;
    	padding-left:40px;
    }
    
    #locations {
    	width:880px;
    }
    	#locations ul {
    		list-style-type:none;
    		width:293px;
    		float:left;
    		text-align:left;
    	}
    		#locations ul li {
    			width:293px;
    			text-decoration:none;
    			clear:right;
    		}
    			#locations ul li ul {
    				width:273px;
    				float:left;
    			}
    				#locations ul li ul li {
    					width:253px;
    					padding-left:20px;
    					padding-bottom:0px;
    				}
    					#locations ul li ul li ul {
    						float:none;
    					}
    						#locations ul li ul li ul li {
    							width:253px;			
    						}
    #locations a {
    	font-family:arial;
    	font-size:11px;
    	text-decoration:none;
    	color:black;
    }
    
    #locations a:visted {
    	color:black;	
    }
    
    #locations a:hover {
    	color:#ba0000;
    }
    The initial problem is fixed, now however, the footer is not being pushed down by these elements in FF unless I add a height to #locations.

    structure is as follows:

    Code:
    		<div id="container">
    			<&#37;= render :partial => 'header' %>
    			<%= render :partial => 'nav' %>
    			
    			<div id="content">
    				<div id="box">
    					<div id="locations_c">
    	                                       <div id="locations">
    		                                       <%= render :partial => 'locations' %>  ### This is the list ###
    	                                        </div>
                                            </div>
    		                  </div>
    			</div>
    			
    			<div id="footer_c">
    				<div id="footer">
    	                              <ul>
    			                    <li><%= link_to "Home", :controller => 'pages', :action => 'index' %></li>
    			                    <li><%= link_to "About Us", :controller => 'pages', :action => 'about' %></li>
    			                    <li><%= link_to "Property Collection", :controller => 'pages', :action => 'locations' %></li>
    			                    <li><%= link_to "Employment", :controller => 'pages', :action => 'employment' %></li>
    			                    <li><%= link_to "News", :controller => 'pages', :action => 'news' %></li>
    			                    <li><%= link_to "Contact Us", :controller => 'pages', :action => 'contact' %></li>
    			                    <li><%= link_to "Site Map", :controller => 'pages', :action => 'Sitemap' %></li>
    	                               </ul>
                                      </div>
    			</div
    
    		</div>
    Last edited by RyanTuosto; 02-27-2008 at 08:32 PM.

  • #5
    Senior Coder jcdevelopment's Avatar
    Join Date
    Oct 2007
    Location
    Cowboy Nation
    Posts
    2,182
    Thanks
    174
    Thanked 257 Times in 257 Posts
    does your footer have clear:both on it!!


  •  

    Posting Permissions

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