SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Enthusiast
    Join Date
    Jul 2005
    Location
    Nashville, TN
    Posts
    29
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Having trouble with firefox...

    http://raisedbykubrick.com/

    Looks fine in IE, but not so good in Firefox. I'm kinda new to CSS, so there's probally a ton of errors. Can anyone look at my code and help me out a bit here? Thanks.

    Save As:

    http://www.raisedbykubrick.com/neverside/left.txt
    http://www.raisedbykubrick.com/neverside/index.txt
    http://www.raisedbykubrick.com/style.css


  2. #2
    SitePoint Evangelist comfixit's Avatar
    Join Date
    Dec 2004
    Location
    Pasadena
    Posts
    537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Huge tip.

    Get Web Developer for Firefox. Its a must have for CSS development. It allows you to view all your CSS along side of your web page and make changes to it in real time and see the results. Do some experimenting and you should be able to isolate whats causing the problem in no time.

    http://chrispederick.com/work/firefox/webdeveloper/

  3. #3
    SitePoint Enthusiast
    Join Date
    Jul 2005
    Location
    Nashville, TN
    Posts
    29
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks, that's a neat tool - but it doesn't really help me right now, as I'm fairly new to CSS, and I don't know what is causing the problems.

  4. #4
    SitePoint Addict
    Join Date
    Sep 2004
    Location
    uk
    Posts
    240
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    what do you want the site to look like...do you have an image or screen shot of how you would like it?

    i see you have your margins set to auto...do you want the site to be centered vertically?

    i will have a look at this for you once i know what you're after.

    cheers
    janice

  5. #5
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,367
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    You are right there are a ton of errors.

    You seem to have 2 doctypes, and 2 of all html,body, meta , link elements inserted randomly in your code.

    You have missing closing divs and some errors in your css logic to do with the broken box model.

    I think this is what you were aiming for although I have had to guess a bit .
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
    <title>raisedbykubrick.com : I'm not going to kill you...but I don't have to save 
    you.</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <style type="text/css">
     @import "all.css"; /* just some basic formatting, no layout stuff */
     
     body {
      text-align:center;
      background-color: #CECBCE;
      }
     
     #frame {
      width:680px;
      background-color: #F2F2EF;
      background-image: url(http://raisedbykubrick.com/img/bg2.gif);
      margin-right:auto;
      margin-left:auto;
      margin-top:0px;
      padding:0px;
      text-align:left;
      border-bottom: 1px solid #9F0A11;
      }
    #sidebar {
     float:left;
     width: 145px;
     padding: 0;
     font-family: Geneva, Arial, Helvetica, sans-serif;
     background-color: #F2F2EF;
     color: #333;
     font-size: 12px;
     height: 100%;
    }
    #sidebar ul {
     list-style: none;
     margin: 0;
     padding: 0;
     border: none;
    }
    #sidebar li {
     border-bottom: 0px solid #AD2831;
     margin: 0;
    }
    #sidebar li a {
     display: block;
     padding: 5px 5px 5px 5px;
     border-left: 10px solid #9F0A11;
     border-right: 10px solid #F2F2EF;
     background-color: #F2F2EF;
     color: #990000;
     text-decoration: none;
    }
    /* mac hide \*/
    * html #sidebar li a {height:1%}
    /* end hide*/
    #sidebar li a:hover {
     border-left: 10px solid #1E357F;
     border-right: 10px solid #F2F2EF;
     background-color: #F2F2EF;
     color: #1E357F; 
      }
     #contentcenter {
      width:495px;
      padding:0px;
      float:left;
      background-color: #F2F2EF;
      }
     
     #contentheader {
      background:#F2F2EF
      }
      
     p,h1,pre {
      margin:0px 10px 10px 10px;
      font-size: 9pt;
    					   font-family: Verdana, Arial, sans-serif ; 
      font-style: normal;
      font-weight: normal;
      color: #000;
      padding-top:10px;}
      
      a.h1:link {color: #9F0A11; text-decoration: none; }
      a.h1:visited {color: #9F0A11; text-decoration: none; }
      a.h1:hover {color: #1E357F; text-decoration: none; }
      a.h1:active {color: #1E357F; text-decoration: none;  } 
     h2 {
      margin:0px 0px 0px 0px;
      font-size: 12pt;
    					   font-family: Arial, sans-serif ; 
      font-style: normal;
      font-weight: bold;
      color: #1E357F;
      padding-top:0px;
      padding-bottom:0px;}
      
      a.h1:link {color: #9F0A11; text-decoration: none; }
      a.h1:visited {color: #9F0A11; text-decoration: none; }
      a.h1:hover {color: #1E357F; text-decoration: none; }
      a.h1:active {color: #1E357F; text-decoration: none;  }
    h3 {
      margin:0px 0px 0px 0px;
      font-size: 10pt;
    		font-family: Arial, sans-serif ; 
      font-style: normal;
      font-weight: bold;
      color: #1E357F;
      padding-top:0px;
      padding-bottom:0px;}
      
      a.h1:link {color: #9F0A11; text-decoration: none; }
      a.h1:visited {color: #9F0A11; text-decoration: none; }
      a.h1:hover {color: #1E357F; text-decoration: none; }
      a.h1:active {color: #1E357F; text-decoration: none;  }
      OL { 
      list-style-type: decimal; 
      list-style-position: outside;
      font-size: 9pt;
    					   font-family: Verdana, Arial, sans-serif ; 
      font-style: normal;
      font-weight: normal;
      color: #000;
      padding-top:10px;}
      
      a.h1:link {color: #9F0A11; text-decoration: none; }
      a.h1:visited {color: #9F0A11; text-decoration: none; }
      a.h1:hover {color: #1E357F; text-decoration: none; }
      a.h1:active {color: #1E357F; text-decoration: none;  }
      } 
     #contentheader h1 {
      font-size: 9pt;
    		font-family: Verdana, Arial, sans-serif ; 
      font-style: italic;
      padding:10px;
      margin:0px;
      }
     #quotetext {
      font-size: 10pt;
    		font-family: Verdana, Arial, sans-serif ; 
      font-style: italic;
      }
     
     #contentright p { font-size:10px; font-color: fff}
     .clearer{
     height:1px;
     overflow:hidden; 
     margin-top:-1px;
     clear:both;
    }
    .center-text{text-align:center}
    </style>
    </head>
    <body bgcolor="CECBCE">
    <div id="frame"> 
      <div id="contentheader" align="center"><img src="http://raisedbykubrick.com/img/header.gif" alt="Stanley Kubrick" /></div>
      <div id="sidebar"> 
    	<ul>
    	  <li><a href="/index.shtml">Home</a></li>
    	  <li><a href="/about.shtml">About</a></li>
    	  <li><a href="/film.shtml">Film</a></li>
    	  <li><a href="/literature.shtml">Literature</a></li>
    	  <li><a href="/music.shtml">Music</a></li>
    	  <li><a href="/reform.shtml">NOdometer</a></li>
    	  <li><a href="/links.shtml">Links</a></li>
    	</ul>
      </div>
      <div id="contentcenter"> 
    	<h1><strong>It is well to dream of glorious war in a snug armchair at home, 
    	  but it is a very different thing to see it first at hand.</strong> - <em><a class="h1" href="http://www.imdb.com/title/tt0072684/" target="_new">Barry 
    	  Lyndon</a></em> (1975)</h1>
    	<br />
    	<br />
    	<img src="http://raisedbykubrick.com/img/line.gif" alt="line" /><br />
    	<!-- // loop start -->
    	<h2><br />
    	  <a class="h1" href="http://www.raisedbykubrick.com/?p=14" rel="bookmark" title="Permanent Link: Stewie gets the straight to DVD treatment">Stewie 
    	  gets the straight to DVD treatment</a></h2>
    	<h3>Monday, July 11th, 2005 </h3>
    	<p>DVDAnswers has the details: </p>
    	<p><img src="http://www.raisedbykubrick.com/img/fgpstewie.gif" align="right" alt="Stewie" /><em>Fox 
    	  has today announced the DVD premiere of Family Guy Presents Stewie Griffin: 
    	  The Untold Story (Unrated), featuring brand new, never before seen content. 
    	  The eighty-three minute feature focuses on Stewie, the maniacal baby genius, 
    	  who goes on an incredible journey which leads him to discoveries far more 
    	  vile and shocking than anything found in his diaper. The extended show will 
    	  be presented in 1.33:1 full frame, along with an English Dolby Surround 
    	  track. Extras will include an alternate “unrated” audio track, 
    	  an audio commentary (the participants are yet to be confirmed), a making 
    	  of featurette, an animatic comparison, and previews for Family Guy Season 
    	  4 and American Dad.</em> </p>
    	<p> Sounds good to me. Stewie, always gold, as been particular amazing this 
    	  season. You can pre-order from <a class="h1" href="http://www.amazon.com/exec/obidos/tg...nce&#038;s=dvd" target="_new">Amazon</a> 
    	  right now. </p>
    	<!-- // this is just the end of the motor - don't touch that line either :) -->
    	<p class="center-text"> <img src="http://raisedbykubrick.com/img/line.gif" alt="oh noes" /><br />
    	  <br />
    	  Larry Vance is proudly powered by <a class="h1" href="http://www.wordpress.org" target="_new">WordPress</a> 
    	</p>
      </div>
      <br />
      <!-- without this little clearer NS6 and IE5PC do not stretch the frame div down to encopass the content DIVs -->
      <div class="clearer"></div>
    </div>
    </body>
    </html>
    Also note that when you save css as an external file you do not include the style tags in the external file as this will confuse some browsers. Only css and css comments go in the external file.

    The page now validates at least

    Hope that helps.

  6. #6
    SitePoint Enthusiast
    Join Date
    Jul 2005
    Location
    Nashville, TN
    Posts
    29
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Wow. Thank you so much. I'm using that, but with SSI, now. Gotta clean up some stuff in Wordpress so it'll validate correctly though.

    Thanks again!

    Also, thanks to the other offers of help from people. Paul kinda swung for the fences.


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
  •