PDA

View Full Version : IE7 - CSS/HTML - Black border to images



greenkiwi1589
Apr 17th, 2010, 02:05 AM
Hi All.
Any help with the following problem would be very much appreciated.
I'm currently working on a website and during cross browser testing in Internet Explorer 7 - I get a black background/border to all content in a particular div. Please see the attached screenshot.

http://green-kiwi.co.uk/images/frontpage.png

Does any have any idea as to what is causing this? I have not encountered this before and can't find any real reference to it on google / bing etc.
Any help would be very much appreciated!
Thanks:D

Excavator
Apr 17th, 2010, 02:17 AM
Hello greenkiwi1589,
Your image tells us absolutely nothing. Link us to the test site and someone here will be able to help you.

greenkiwi1589
Apr 17th, 2010, 02:43 AM
Hi - thanks for the quick response. you can access the site in the attached link.

RE: inline style sheets - we know this is not ideal, but for the purposes of testing this page, we have them in page instead of an external style sheet

Thanks

http://www.staging.goldmanprize.advantagelabs.com/

code beginner
Apr 17th, 2010, 03:12 AM
try placing this in the relevant css:

border: 0px

Excavator
Apr 17th, 2010, 03:20 AM
http://www.staging.goldmanprize.advantagelabs.com/

Adding border: 0; would get rid of the default border around linked images but this looks more like the background of a containing div since it's only right/bottom.

Still waiting to see, the link gives me this:

The requested page could not be found.

aangelinsf
Apr 17th, 2010, 03:49 AM
Hi, Excavator. I'm working with greenkiwi on the project. He will pick up this thread later in his morning (it's 3am for him now) and in the meantime I'm going to move it forward as much as I am able (he's the HTML guru).

We've corrected the staging server so that you should now be able to examine the page properly.

aangelinsf
Apr 17th, 2010, 03:54 AM
BTW, thank you for this help. We are at a loss with this one!

Excavator
Apr 17th, 2010, 08:26 AM
Hello aangelinsf,
Sorry I took so long to answer - went out for dinner.

If you look through the embedded css in the head of that page you will find the following -


#front-bottom {
width:800px;
height:300px;
display:inline;
background-color:black;
}

Delete that line highlighted in red.
I'm not sure exactly why it's showing between the anchor and the image...

There are a few more errors that can easily be fixed too - http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.staging.goldmanprize.advantagelabs.com%2F

greenkiwi1589
Apr 17th, 2010, 03:32 PM
Hi Excavator,
Thanks for the suggestions
Removing the background:black around from the front-bottom div solved the issue!
Why it was applying a black border between the anchor and image is beyond me as well - but thanks for the quick responses and solution

aangelinsf
Apr 17th, 2010, 04:07 PM
Fabulous! Thank you!!