Border and IE

[Samuel van Laere]

Just wondering about something really minor,
if its fixable i'll fix it, else: couldn't care less
Here's the page:
http://www.oukje.nl/gastenboeklezen.php
Notice the difference between IE and Geckobrowsers,
for some reason IE won't display the right double border.

Anyone with a fix? (one that doesn't resolve to hacking CSS, perhaps?)

Cheers,
Sam

 

[Jukka K. Korpela]

Scripsit Samuel van Laere:

Just wondering about something really minor,
if its fixable i'll fix it, else: couldn't care less
Here's the page:
http://www.oukje.nl/gastenboeklezen.php
Notice the difference between IE and Geckobrowsers,
for some reason IE won't display the right double border.

The "double border" here refers to the visual impression created by the
border of a table together with the borders of the cells, when there's a
small gap (due to browser defaults).

The problem seems to be in this rule in your gastenboek.css file:

#divboek span.marker {
color: #000000;
float: right;
font-weight: bold;
margin-left: 5px;
margin-top: 2px;
padding: 1px;
width: 100%;
}

If you remove the lines
float: right;
width: 100%
then the "double border" appears on the right. Making spans float often
causes problems. I don't quite see what you are aiming at with that rule, so
I won't make a specific suggestion on how to fix it. Wy don't you just use
<div> instead of <span>, without float or width in CSS but with some rule
that suppresses vertical margins for <p>?

P.S. Use the W3C CSS Checker; you have a syntax error in your style sheet
(probably unrelated to the problem at hand, but still).

 

[Samuel van Laere]

If you remove the lines
float: right;
width: 100%
then the "double border" appears on the right. Making spans float often
causes problems. I don't quite see what you are aiming at with that rule,
so I won't make a specific suggestion on how to fix it. Wy don't you just
use <div> instead of <span>, without float or width in CSS but with some
rule that suppresses vertical margins for <p>?

You found the problem and a solution to, thats just great.
Here's what I did to fix it:

#divboek span.marker {
color: #000000;
float: left;
font-weight: bold;
margin-left: 0px;
margin-top: 2px;
padding: 1px;
}

Gave me the same effect with even lesser rules )

P.S. Use the W3C CSS Checker; you have a syntax error in your style sheet
(probably unrelated to the problem at hand, but still).

Thanks Jukka, i've fixed two errors.