CSS not working in mozilla

ashokdudhade · #1 (**permalink**) 07-04-08, 06:03 AM

I have designed CSS files they are working in IE6 & 7 but they not working in mozilla?

Nico · #2 (**permalink**) 07-04-08, 06:06 AM

Post. Your. Code!

D3C · #3 (**permalink**) 07-04-08, 06:48 AM

We can't help you if you don't display your code.

ashokdudhade · #4 (**permalink**) 07-04-08, 07:17 AM

css Code:

body{
    padding: 0;
    background: #FFFFFF;
    width: 699px;
    font-family:  sans-serif;
    color: #3B3B3B; 
        line-height: 14px; 
        font-size: 0.75em;
    BORDER-RIGHT:  black 1px solid;
    PADDING-RIGHT:  5px;
    BORDER-TOP:  black 1px solid;
    PADDING-LEFT:  5px;
    PADDING-BOTTOM:  10px;
    MARGIN-TOP:  20px;
    MARGIN-BOTTOM:  20px;
    MARGIN-LEFT:  125px;
    BORDER-LEFT:  black 1px solid;
    PADDING-TOP:  28px;
    BORDER-BOTTOM:  black 1px solid
}

This is the code. The body border is not displaying properly.

Vicious · #5 (**permalink**) 07-04-08, 05:45 PM

Maybe it isn't possible to correctly visualise this in Mozilla.. ?
Besides, try using lower case.

D3C · #6 (**permalink**) 07-04-08, 05:57 PM

So the border is not displaying in firefox?

job0107 · #7 (**permalink**) 07-05-08, 01:04 AM

Trying to manipulate the body element kinda restricts what you can do with your layout.
By using div elements and manipulating their margins, you can accurately control the size and position of the element.
And by manipulating their padding you can accurately control the positioning of their contents.

Example:

CSS Code:

<html>
<head>
<style>
body
{
 margin:0px;
 background-color:#FFFFFF;
 color:#3B3B3B;
 font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
 line-height:14px;
 font-size:0.75em;
 }
#header
{
 height:19%;
 margin-left:25%;
 margin-right:5%;
 padding-left:10px;
 padding-top:5px;
 border:1px solid #000000;
 }
#content
{
 height:52%;
 margin-left:5%;
 margin-right:25%;
 padding-left:50px;
 padding-top:40px;;
 border:1px solid #000000;
 }
#footer
{
 height:19%;
 margin-left:15%;
 margin-right:15%;
 text-align:center;
 padding-top:15px;
 border:1px solid #000000;
 }
</style>
<!--[if IE]>
<style>
#header
{
 height:20%;
 }
#content
{
 height:60%;
 }
#footer
{
 height:20%;
 }
</style>
<![endif]-->
</head>
<body>
  <div id="header">Header Stuf</div>
  <div id="content">Content Stuf</div>
  <div id="footer">Footer Stuf</div>
</body>
</html>