I was wondering if it is possible to align a picture using the align=middle style in CSS, not html.
<img alt="" src="http://upload.wikimedia.org/wikipedia/commons/thumb/8/80/Smiley.png/50px-Smiley.png" align="middle" />Text!
I was wondering if it is possible to align a picture using the align=middle style in CSS, not html.
<img alt="" src="http://upload.wikimedia.org/wikipedia/commons/thumb/8/80/Smiley.png/50px-Smiley.png" align="middle" />Text!
Try this,
img{
vertical-align:middle;
}
Use css property vertical-align:middle;
you are using align
attribute that in CSS is float : left;
or float : right;
middle won't do anything, you only have option left or right.
For vertical-align, answers have already been given.
to center a single image on a line , you can use on parent : text-align:center;
, image is an inline-box that reacts like text.
You can as well set image in display : block;
and margin : auto;
img { vertical-align: middle; }
See this Fiddle: http://jsfiddle.net/SN6Jp/
You can use text-align:center;
for the container of the img
e.g. a div
and for the image to be aligned vertically at the middle use vertical-align:middle;
as follows:
div
{
text-align:center;
}
img
{
vertical-align:middle;
}
<div>
<img alt="" src="http://upload.wikimedia.org/wikipedia/commons/thumb/8/80/Smiley.png/50px-Smiley.png"/>Text!
</div>
Check this demo