32 users online (1 members and 31 guests)  


  Results 1 to 2 of 2
  1. #1
    samejenny's Avatar
    New User

    Status
    Offline
    Join Date
    May 2008
    Posts
    1

    Hi, everyone, can anyone help me with this?

    I would like all my pages to be centered and that to work in IE too.
    How can I fix the following problems?
    1. in IE page is not centered although FF shows it correctly.
    2. When menu buttons are clicked, position of page changes, some are centered, some are closer to the left side?

    All pages refer to the same 2 css files (one for page and a distinct one for menu).

    I would be very grateful if someone could indicate what the problem is and help me fix it:
    The pages are online but maybe you can imagine the woobly unintended effect.

    Thank you in advance,

    Samejenny

    My css file looks like this:

    Code:
    body { 
    background-color: #F1F6FE; 
    font-family: Arial, Helvetica, sans-serif; 
    font-size:13px; 
    }
    
    #conteneur { 
    background-color:#fafafa; 
    margin: 0 auto; 
    width:840px; 
    border:1px solid #202020; 
    }
    
    #haut { 
    background: #660000; 
    height:26px; 
    max-height:30px; 
    }
    
    #header { 
    background: #336699 url(images/mainhead.jpg) no-repeat; 
    color:#fafafa; 
    font-size:24px; 
    height: 85px; 
    padding-left:20px; 
    padding-top:5px; 
    }
    
    #maintop { 
    clear:both; 
    }
    
    #pied { 
    border-top:1px dashed #202020; 
    padding:0.5em; 
    text-align:right; 
    clear: both; 
    height: 42px; 
    }
    
    h1 { 
    font-size:1.6em; 
    margin:0.5em 0.5em 1em 0; 
    }
    
    h2 { 
    clear: both; 
    background: #660000; 
    font-size:18px; 
    margin: 5px 0px 5px 20px; 
    padding-left: 15px; 
    line-height:29px; 
    color: #FFFFFF; 
    }
    
    h3 { 
    clear: both; 
    background: #EDDA74 url(images/bgmenu.gif); 
    font-size:16px; 
    line-height:29px; 
    margin:0.8em 0.5em 0.3em 0.8em; 
    padding-left: 15px; 
    color: #660000; 
    }
    
    h4 { 
    font-size:1em; 
    margin: 5px 0px 5px 10px; 
    color: #660000; 
    }
    
    h5 { 
    font-size:0.9em; 
    margin:0.6em 0.5em 0.2em 1.5em; 
    }
    
    p { 
    margin: 10px 10px 10px 10px; 
    padding: 10px 10px 10px 10px; 
    text-align: justify; 
    }
    
    #service { 
    border: 1px dashed #336699; 
    background-color: #F1F6FE; 
    margin-left:70px; 
    width:60%; 
    padding: 10px 10px 10px 10px; 
    }
    
    #news_box{ 
    border: 1px dashed #336699; 
    background-color: #EDDA74; 
    margin: 20px 5px 5px 20px; 
    padding: 10px 10px 10px 10px; 
    width: 75%; 
    }
    
    #left { 
    border-bottom:0; 
    border-right: 0px solid #CCCCCC; 
    color:#000; 
    float:left; 
    background-color:#fafafa; 
    width: 480px; 
    padding: 20px 8px 0 8px; 
    }
    
    .floatimgleft { 
    float:left; 
    margin-top:10px; 
    margin-left:20px; 
    margin-right: 8px; 
    margin-bottom: 3px; 
    
    } 
    
    .info_box{ 
    border: 1px dashed #336699; 
    background-color: #F1F6FE; 
    margin: 20px 3px 20px 3px; 
    padding: 10px 5px 10px 5px; 
    width: 38%; 
    float: right; 
    } 
    ul{ 
    list-style-type: none; 
    margin-left:10px; 
    }
    
    li { 
    margin:10px; 
    list-style-image: url(images/bullet.gif) 
    } 
    
    #right 
    {
    
    width: 320px; 
    padding: 20px 10px 0 10px; 
    float:right; 
    background-color:#fafafa; 
    
    } 
    .img { 
    margin-left: 40px;
    
    }
    
    .form 
    {margin:0 auto; 
    padding:4px 0 4px 0; 
    font-family: Helvetica, Tahoma, Arial, sans-serif; 
    text-align: left; 
    font-size: 12px; 
    line-height: 20px; 
    color:#000000; 
    width: 300px; 
    }
    
    select { 
    background-color: #FFFFFF; 
    border: 1px solid #CCCCCC; 
    font: 12px, "arial", helvetica, sans-serif;
    
    }
    
    input { 
    background-color: #FFFFFF; 
    border: 1px solid #CCCCCC;
    
    }
    
    fieldset{ 
    border: 1px dashed #336699; 
    display: inline; 
    vertical-align: top; 
    padding: 10px 5px 10px 10px; 
    width: 250px; 
    /*background-color: #EDDA74;*/
    
    } 
    legend{ 
    background-color: #660000; 
    border: 1px solid #CCCCCC; 
    font-weight: bold; 
    color: #FFFFFF; 
    padding: 0 5px 0 5px;
    
    }
    
    LoginSubmit 
    { 
    background-color: #FF6600; 
    margin: 0px; 
    height:20px; 
    font: 12px, arial, helvetica, sans-serif; 
    font-weight: bold; 
    }
    
    textarea { 
    background-color: #FFF; 
    border: 1px solid #CCCCCC;
    
    }
    
    radio { background-color:#EDDA74; 
    border: 0; 
    }
    
    checkbox { 
    background-color:#EDDA74; 
    border: 0; 
    }
    
    #wide { 
    
    width: 780px; 
    }
    
    fieldset.wide{ 
    border: 1px dashed #336699; 
    display: inline; 
    vertical-align: top; 
    padding: 10px 5px 10px 10px; 
    width: 700px; 
    background-color: #F1F6FE;
    
    }
    
    legend.wide{ 
    background-color: #336699; 
    border: 1px solid #CCCCCC; 
    font-weight: bold; 
    color: #FFFFFF; 
    padding: 0 5px 0 5px;
    
    }
    
    p.wide { 
    border: 1px dashed #660000; 
    padding: 10px 5px 10px 10px; 
    margin-left: 20px; 
    width: 730px; 
    background-color: #F1F6FE; 
    
    }
    Last edited by vinyl-junkie; 08-21-2008 at 09:23 PM. Reason: Added code tags

  2. #2
    jthayne's Avatar

    Status
    Offline
    Join Date
    Aug 2008
    Location
    Texas
    Posts
    508

    Re: Hi, everyone, can anyone help me with this?

    Add this to the beginning of your CSS file:

    Code:
    * {
    margin: 0;
    padding: 0;
    }
    That should resolve quite a few issues.
    Last edited by vinyl-junkie; 08-21-2008 at 09:23 PM. Reason: Added code tags