PDA

View Full Version : image valign =top in css



esthera
Mar 25th, 2007, 12:18 PM
i have an image that i'm doing float:left

how can i make it that the image starts at the same level as the text (now it starts under the text)

my css is


.page img{
float:left;
padding-top:0px;
margin-top:-10px;
padding-right:10px;
padding-left:2px;
}

Bill Posters
Mar 25th, 2007, 12:30 PM
See: vertical-align (http://www.w3schools.com/css/pr_pos_vertical-align.asp)

esthera
Mar 25th, 2007, 12:40 PM
.page img{
float:left;
padding-top:0px;
margin-top:0px;
padding-right:10px;
padding-left:2px;
vertical-align: text-top;
}

this is still not working: any ideas?

Bill Posters
Mar 25th, 2007, 01:44 PM
Have you tried placing the image as the first element within the parent paragraph?

It's not clear whether you're after aligning an image within a flow of text or simply wishing to present an image aligned to a block of content.

Post a link to the page.

Arbitrator
Mar 26th, 2007, 05:40 AM
The vertical-align property won’t do anything for a floated element. That property only applies to inline‐level and table cell elements; floated elements are, by nature, block‐level.

If you’re trying to get the floated image to have its top adjacent to the top of a specific line of text, then this issue has nothing to do with the valign attribute. There’s a bug (https://bugzilla.mozilla.org/show_bug.cgi?id=50630) related to that in Firefox. You can compare with Opera 9, which gets that part of the float model right.

As Bill Posters suggested, we need to see some code to definitively address your issue.