CSS code not reflecting

by **kaymeis** » Wed Oct 28, 2009 2:54 pm

hi, my CSS code is not rendering at all. The only element working is the background color. I've cleaned out all the temporary Internet files in my folder and still, onlt the background color is working. Here is the code for both css and xhtml

CSS

body{background-color:#87ceeb;
}

i

.akshion{font-size:24;
font-weight:bold;
color: #66ccff;
font-style: italic;
text-align: left;
}

align.left{display:block;
width:640px;
height:400px;
background:blue;

XHTML
<link href="atk.css" rel="stylesheet" type="text/css" />
<body>
<img src="ak-shion.gif" width="640" height="400" alt="Ak-Shion" class="align.left"/>

<h1 class="akshion">Ak-Shion <h1/>

</body>
</html>
}

by **falkencreative** » Wed Oct 28, 2009 3:53 pm

You have some incorrect formatting... You also can't have periods in your class names. (No "align.left" -- it needs to be "alignleft").

CSS:

Code: Select all: body { background-color:#87ceeb; } i <-- unnecessary extra character. Could be causing issues. .akshion{font-size:24; <-- incorrect. Should be in pixels, ems, etc. font-weight:bold; color: #66ccff; font-style: italic; text-align: left;} align.left { display:block; <-- no period in the middle of a class name. Needs period at the beginning of the class name. width:640px; height:400px; background:blue; <-- need closing bracket

XHTML:
This needs proper code, including doctyype, opening /closing html and head tags.

Code: Select all:  <html> <head> <title>title here</title> <link href="atk.css" rel="stylesheet" type="text/css" /> </head> <body> <img src="ak-shion.gif" width="640" height="400" alt="Ak-Shion" class="align.left"/> <-- change class to "alignleft" <h1 class="akshion">Ak-Shion <h1/> </body> </html>

by **Andy** » Wed Oct 28, 2009 4:52 pm

falkencreative wrote:You also can't have periods in your class names. (No "align.left" -- it needs to be "alignleft").

That's correct because:

Code: Select all: .align.left { .. }

maps to two different classes. That is, an element that has both "align" and "left":

Code: Select all: <div class="align left"> </div>

They should be avoided when working with IE6.

Welcome!

Smashing Links

Statistics

TOP POSTERS

CSS code not reflecting

CSS code not reflecting

Re: CSS code not reflecting

Re: CSS code not reflecting

Who is online