7 replies [Last post]
clay
Offline
Regular
Sydney.
Last seen: 17 years 29 weeks ago
Sydney.
Timezone: GMT+10
Joined: 2004-11-09
Posts: 15
Points: 0

Hey there guys, just had a problem arise with my borders on images. It seems that when I add a border (1 px) to an image, it appears just fine in Firefox (no surprises there,) but with IE, it appears to give me the slightest space at the bottom (which could only really be described as a "padding".) Anyone help me out here...?

clay
Offline
Regular
Sydney.
Last seen: 17 years 29 weeks ago
Sydney.
Timezone: GMT+10
Joined: 2004-11-09
Posts: 15
Points: 0

Image border: IE not behaving itself...

Okay have just put the pages up on the server for you all to look at... The image border thing occurs on all pages...

And there is also an issue I'm having on the "Charts" page where the top chart in the middle column isn't lining up in IE...

Have a look...

http://www.indiesoundz.com/clay/_bassboy/charts.htm

clay
Offline
Regular
Sydney.
Last seen: 17 years 29 weeks ago
Sydney.
Timezone: GMT+10
Joined: 2004-11-09
Posts: 15
Points: 0

Image border: IE not behaving itself...

C'mon, I thought that this would be an easy one for you pros! Laughing out loud

thepineapplehead
thepineapplehead's picture
Offline
Moderator
Last seen: 4 weeks 6 days ago
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9683
Points: 819

Image border: IE not behaving itself...

Don't double (or triple) post. It's frigging annoying. Some boards even ban you for it.

It's an IE whitespace bug. See this?

<div id="in_welcome_photo">
	          <img src="images/charts_main.jpg" alt="Current Charts" title="Current Charts" />
			</div>

Replace it with this:

<div id="in_welcome_photo"><img src="images/charts_main.jpg" alt="Current Charts" title="Current Charts" /></div>

Note the removal of the space between the image and the closing div tag.

Verschwindende wrote:
  • CSS doesn't make pies

dJomp
dJomp's picture
Offline
Enthusiast
Last seen: 6 years 17 weeks ago
Joined: 2003-03-23
Posts: 422
Points: 0

Image border: IE not behaving itself...

Yes, come on, 2 and a half hours isn't nearly long enough to wait. A day? Maybe two? It's not like the post is going to get lost on the board, it'll still be marked unread to us all...

I'd comment on the use of the DIVs at all. Why not just give the IMG tag a border? Gets rid of the whitespace bug altogether.

You know you're a geek when you try to shoo a fly away from the monitor with your cursor.

clay
Offline
Regular
Sydney.
Last seen: 17 years 29 weeks ago
Sydney.
Timezone: GMT+10
Joined: 2004-11-09
Posts: 15
Points: 0

Image border: IE not behaving itself...

I've thought of that, however the project that I'm doing is for my Certificate 4 in Website Design, and one of the guidelines is that CSS must be used wherever possible. Marks are lost for border attributes in an image tag.

Thanks for the help anyway guys, much appreciated. And sorry for the errr, triple post. At the time, I was loaded with coffee and pulling my hair out... :roll:

dJomp
dJomp's picture
Offline
Enthusiast
Last seen: 6 years 17 weeks ago
Joined: 2003-03-23
Posts: 422
Points: 0

Image border: IE not behaving itself...

No, you can do a border on an IMG tag with CSS:

IMG {
border : 1pt solid black;
}

In fact you can do everything; like margins, padding, positioning... gets rid of the DIV. See http://www.yorkunikarting.co.uk - the image banner at the top has nothing around it. The image itself is absolutely positioned.

You know you're a geek when you try to shoo a fly away from the monitor with your cursor.

clay
Offline
Regular
Sydney.
Last seen: 17 years 29 weeks ago
Sydney.
Timezone: GMT+10
Joined: 2004-11-09
Posts: 15
Points: 0

Image border: IE not behaving itself...

Worked a treat! I just added a style rule for any images inside that particular div... now it does it for everything! Wink