firefox problem

Discussion in 'CSS' started by rojojat, Jun 21, 2009.

  1. #1
    Hi;
    This script looks good in IE but not firefox.

    <p class="right"> pushes down when I put in text.







    <html>
    <head><title>index</title>
    <style>
    body{margin-top:0;background-color:#bbb;text-align:center;}
    #container{width:751px;height:600px;margin-top:0;margin-bottom:0;margin-left:auto;margin-right:auto;border:solid 1px black}
    #header{width:751px;height:150px;background-image:url(petes_header.png);background-repeat:no-repeat;font-family:helvetica;color:white;font-size:13px}
    #main{margin:0 0 0 0;width:751px;height:450px;}
    .nav{float:right;margin-top:129px;margin-right:10px}
    .left{float:left;margin:0 0 0 0;background-color:#aaa;width:200px;height:450px}
    .right{float:right;margin:0 0 0 0;background-color:#fff;width:549px;height:450px}
    h1{font-size:12px;color:#fff}
    </style>
    </head>
    <body>
    <div id="container">
    <div id="header"><p class="nav">Home | Products | About | Contact </p></div>
    <div id="main">
    <p class="left">
    Products<br/><br/>
    <a href="#"> Link 1 </a><br/><br/>
    <a href="#"> Link 2 </a><br/><br/>
    <a href="#"> Link 3 </a><br/><br/>
    <a href="#"> Link 4 </a><br/><br/>
    <a href="#"> Link 5 </a><br/>


    </p>
    <p class="right">hello</p>
    </div>










    </div></body></html>
     
    rojojat, Jun 21, 2009 IP
  2. drhowarddrfine

    drhowarddrfine Peon

    Messages:
    5,428
    Likes Received:
    95
    Best Answers:
    7
    Trophy Points:
    0
    #2
    Never, ever use IE as a reference for how things work. IE is 11 years behind all other browsers in modern standards and practices. Always, always look at any other browser and question, why is IE different? But the multitude of bugs and quirks in IE are known, as are the hacks to fix it.

    You will never get IE to attempt to perform like other more modern browsers without a proper doctype. Put this on your first line:

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
     
    drhowarddrfine, Jun 21, 2009 IP
  3. rojojat

    rojojat Peon

    Messages:
    43
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Sorry for the way I frazed it. I put the
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">

    in but still no luck. the right class div is still pushing down when I add text.
     
    rojojat, Jun 21, 2009 IP
  4. rojojat

    rojojat Peon

    Messages:
    43
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    I removed the #main div
    created a background color for the container and removed the background-color in the right class.
     
    rojojat, Jun 21, 2009 IP
  5. justinlorder

    justinlorder Peon

    Messages:
    4,160
    Likes Received:
    61
    Best Answers:
    0
    Trophy Points:
    0
    #5
    It is better you give thr url . In this way we can review the problem clearly .
    Anyway, adding the document type is the first step to do the right thing. Don't remove the document type.
     
    justinlorder, Jul 1, 2009 IP