/    Sign up×
Community /Pin to ProfileBookmark

Need help removing space in between header image and border in IE

Copy linkTweet thisAlerts:
Nov 01.2012

I have a header image that is suppose to have a 2px solid black border around it, right? Everything looks great in Firefox and Chrome, but IE9 will includes an extra space in between the border and the image. I’ve tried to get rid of it by changing the margins and padding with no luck. Can anybody lend a hand?

Here’s the relevant markup in HTML:

<body>
<header>
<img src=”contactbenjamin.jpg” alt=”Contact Benjamin Heading.”/>
</header>

Here’s the relevant CSS:

header img {
height: 190px;
width: 1000px;
border-top-width: 2px;
border-top-style: solid;
border-top-color: black;
border-bottom-width: 2px;
border-bottom-style: solid;
border-bottom-color: black;
padding-top: 0;
padding-bottom: 0;
}

header {
width: 1000px;
left: 172.5px;
}

Take a look at the source code of the actual page [URL=”http://www.benjamincook1.com/Contact%20Ben.html”]here[/URL]

Any help with this will be much appreciated.

Thanks.

to post a comment
HTML

8 Comments(s) ↴

Copy linkTweet thisAlerts:
@rtretheweyNov 01.2012 — The page looks identical in IE9 and Firefox to me. No space between the image and the border that I can see.
Copy linkTweet thisAlerts:
@UAL225Nov 01.2012 — Add this to the start of your CSS. This will solve it, although it will remove all borders, and paddings that are automatic, but inturn you have great control since you style it through your CSS knowing its all the same.

[code=html]
* {
padding:0;
margin:0;
}
[/code]
Copy linkTweet thisAlerts:
@Benjammin854authorNov 02.2012 — I tried your suggestion, UAL225, but I still have that stupid space in between the image and the border in IE9. Strange how

rtrethewey (above comment) says he doesn't see the space on his IE9.
Copy linkTweet thisAlerts:
@Benjammin854authorNov 02.2012 — That's weird, there is a definite space on my IE9 browser rendering. Wonder why I see it and you don't.
Copy linkTweet thisAlerts:
@UAL225Nov 02.2012 — I dont see the space either to be honest, but I know that code removes all spacing and padding around your images and such. If this is the case, you may want to check your browser and or reinstall it.
Copy linkTweet thisAlerts:
@Benjammin854authorNov 02.2012 — Yeah, thanks for your help. You know what is interesting? I just discovered in IE9 that when I zoom in or zoom out of the page the space I'm talking about goes away. Weird that it's not consistent. I'm probably viewing my page at a different zoom setting than you.
Copy linkTweet thisAlerts:
@UAL225Nov 02.2012 — I just zoomed out on your page as well, and saw it. Although you shouldnt worry about this since most people are using 100% zoom and dont change it unless by accident. If you noticed if you keep zooming out, the space goes away.
Copy linkTweet thisAlerts:
@sumanthanNov 02.2012 — Let me know weather this one is working in your computer

<html ><body>

<header style="width: 1000px; left: 172.5px;">

<div style="border-top-style:solid; border-top-width: 100px; border-top-color:Black;border-bottom-color:Black; border-bottom-style:solid; border-bottom-width:25px;" >

<img src="apple.jpg" alt="Contact Benjamin Heading."

style="width: 1000px; height:190px" /></div>

</header>

</body>
×

Success!

Help @Benjammin854 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.27,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...