CODEWITHSUNDEEP
htmlcsswordpressxhtml
Mark R
Mark R

Reputation: 557

Image height and width not working?

On this post I have set the image height and width and it's clearly seen in the HTML..

[url removed]

But the browser or Wordpress is causing the image to stay same size.

I want it to be smaller?

Upvotes: 31

Views: 182525

Answers (5)

Atul Sharma
Atul Sharma

Reputation: 1102

I have the same issue but I have noticed that if you set width before height then it will work fine.

<img src="your_image_url_here" width="100" height="100" />

Upvotes: 0

Rushikesh Aundhakar
Rushikesh Aundhakar

Reputation: 21

First of all check if you have the link tag that points towards the .css file like below cuz what happened to me is that i didn't use the link tag to specify the .css file that i wanted to use because of that i wasn't able to use it and like an idiot i kept refreshing the page wondering what was wrong with the file. so if you don't want to embarrass yourself then check that first then try the answers above. Hopefully it was helpful.

 <link rel="stylesheet" href="ProjectStyle.css">

Upvotes: 0

Alexandre Khoury
Alexandre Khoury

Reputation: 4012

You must write

<img src="theSource" style="width:30px;height:auto;" />

Inline styling will always take precedence over CSS styling. The width and height attributes are being overridden by your stylesheet, so you need to switch to this format.

Upvotes: 91

maiorano84
maiorano84

Reputation: 11951

http://www.markrafferty.com/wp-content/w3tc/min/7415c412.e68ae1.css

Line 11:

.postItem img {
    height: auto;
    width: 450px;
}

You can either edit your CSS, or you can listen to Mageek and use INLINE STYLING to override the CSS styling that's happening:

<img src="theSource" style="width:30px;" />

Avoid setting both width and height, as the image itself might not be scaled proportionally. But you can set the dimensions to whatever you want, as per Mageek's example.

Upvotes: 4

Andres I Perez
Andres I Perez

Reputation: 75379

You have a class on your CSS that is overwriting your width and height, the class reads as such:

.postItem img {
    height: auto;
    width: 450px;
}

Remove that and your width/height properties on the img tag should work.

Upvotes: 10

Related Questions