...

View Full Version : Specify image size in CSS



spadez
02-10-2008, 06:29 PM
Hey guys,

Im using a javascript mod which requires me to state the dimensions of all of my images in my html. I have the code for my header image in my css instead, as this code:



h1 {
margin:0px; padding:0px; margin-bottom:5px;
text-indent:-9009px;
height:132px;
widows:400px;
background:url(xxx/logo.png) no-repeat;
}


Which is here in my index:


<a href="index.html"><h1>Blah Blah Blah</h1></a>

Can somebody please explain how i can state the dimensions of my image in my code without changing the way the end result looks in IE?

Thanks!

James

VIPStephan
02-10-2008, 06:58 PM
Im using a javascript mod which requires me to state the dimensions of all of my images in my html.

Uhm, for this you actually need an image in your HTML.


I have the code for my header image in my css instead […]

See? CSS ≠ HTML



Can somebody please explain how i can state the dimensions of my image in my code […]?

You can’t change the dimensions of background images. As you said yourself earlier you need to specify the dimensions of images in your HTML. That means you have to put the image as actual image into the HTML, not as background image in the CSS.

And also the HTML you showed is incorrect and invalid. Anchors can’t contain headline elements, it has to be vice versa:


<h1><a href="index.html">Blah Blah Blah</a></h1>

spadez
02-10-2008, 07:28 PM
Ok, i understand what you are saying. However, when i remove the header image code from my css so h1 is this instead:



h1 {
margin:0px; padding:0px; margin-bottom:5px;
text-indent:-9009px;
height:132px;
widows:400px;
}


And put this in my html:

<h1><a href="index.html"><img src="images/logo.png" /></a></h1>

The logo.png doesnt show up. Ive even tried hardcoding the image but it still doesnt show up. Can you explain why this is happening please?

James

VIPStephan
02-10-2008, 07:48 PM
Is the path correct? If you type http://example.com/images/logo.png (where examplt.com is your domain) does the image show up? What do you mean by “hardcoding the image”?

spadez
02-10-2008, 07:57 PM
<h1><a href="index.html"><img src="http://www.hiven.net/radio/images/logo.png" /></a></h1>

This is the code im using now, when you go to that web address the image does show up, but when you look on my index.html it doesnt. I can post the contents of my css and html pages if that helps.

bazz
02-10-2008, 08:00 PM
well, I see your image so it is definately online.
Are you sure that the path to image in your index file is exactly the same as in the link you posted? if there is the slightest difference, the image will not show.

bazz

spadez
02-10-2008, 08:06 PM
Nope it is exactly the same, i copied and pasted it. I think it might be showing under the tiled background image or something random like that. Is there any way i can narrow down the problem.

If i remove the image code from the <h1> tags the image shows up, it just breaks something else.

Apostropartheid
02-10-2008, 09:10 PM
'Cause you're using text-indent. Remember images are inline elements.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum