I have the following tag
<img src="http://img705.imageshack.us/img705/119/original120x75.png"style="height:100px;"
style="width:100px;" alt="25"/>
I have put two incline CSS commands in
style="width:100px;"
style="height:100px;"
For some reason the picture has 100px height but no width.
I assume this is because you can't write two of these in a row in the same tag.
If this is true, is there a way to assign both the height and width?
I have already assigned a different image size on my external CSS, and I don't think you can add img properties in the div tag properties on the external CSS.
thanks
You don't need 2 style attributes - just use one:
<img src="http://img705.imageshack.us/img705/119/original120x75.png"
style="height:100px;width:100px;" alt="25"/>
Consider, however, using a CSS class instead:
CSS:
.100pxSquare
{
width: 100px;
height: 100px;
}
HTML:
<img src="http://img705.imageshack.us/img705/119/original120x75.png"
class="100pxSquare" alt="25"/>
Do not use more than one style attribute. Just seperate styles in the style attribute with ;
It is a block of inline CSS, so think of this as you would do CSS in a separate stylesheet.
So in this case its:
style="height:100px;width:100px;"
You can use this for any CSS style, so if you wanted to change the colour of the text to white:
style="height:100px;width:100px;color:#ffffff" and so on.
However, it is worth using inline CSS sparingly, as it can make code less manageable in future. Using an external stylesheet may be a better option for this. It depends really on your requirements. Inline CSS does make for quicker coding.
if use Inline CSS you use
<img src="http://img705.imageshack.us/img705/119/original120x75.png" style="height:100px;width:100px;" alt="705"/>
Otherwise you can use class properties which related with a separate css file (styling your website) as like In CSS File
.imgSize {height:100px;width:100px;}
In HTML File
<img src="http://img705.imageshack.us/img705/119/original120x75.png" style="height:100px;width:100px;" alt="705"/>
You should use :
<img src="http://img705.imageshack.us/img705/119/original120x75.png" style="height:100px;width:100px;" alt="25"/>
That should work!!
If you want to create class then :
.size {
width:100px;
height:100px;
}
and then apply it like :
<img src="http://img705.imageshack.us/img705/119/original120x75.png" class="size" alt="25"/>
by creating a class you can use it at multiple places.
If you want to use only at one place then use inline CSS. Also Inline CSS overrides other CSS.
Source: Stackoverflow.com