I am trying to make a news column on a site i am currently working on, where it would have have 64px x 64px image to the left of some text. It looks fine in dreamweaver, but when i preview it in a browser the image appears on top of the text.

 

here is the part of the css that deals with the text and image, if anyone could point me in the right direction that would be great.

 

.news {

margin:0px 0px 10px 0px;

width:340px;

min-height:30px;

float:left;

border-bottom:#A67835 1px dotted;

}

* html .news {height:30px}

 

.64x64 {

margin:0px 5px 0px 0px;

width:64px;

height:64px;

float:left;

background-color:#666666;

}

 

.news_text {

margin:5px 0px 5px 0px;

width:260px;

min-height:20px;

float:left;

color:#FFFFFF;

font-weight:bold;

font-size:14px;

}

* html .news_text {height:20px}

 

 

And the html for that part.

 

<div class="news">

<div class="64x64"><img src="images/turner68.png" alt="Frank Turner"></div>

<div class="news_text">READ OUR EXCLUSIVE INTERVIEW WITH FRANK TURNER</div>

</div>

 

This is how it should look

 

but this is how it looks

 

 

If anyone help that would be great.

Hi, you cant start a class definition with a number so .64x64 wont parse properly.

Change it to .div64x64 and amend your HTML code accordingly and it will work fine

Thank you so much for the quick reply.

You are welcome