/    Sign up×
Community /Pin to ProfileBookmark

border around an overflow – FF probs

Hey, Now Firefox is being a bit of a lunatic, I would say.

Can anyone tell me why this all so ever great browser doesn´t wrap a border around the whole content when an object is set to overflow.

code example

[code=html]<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”
“http://www.w3.org/TR/html4/loose.dtd”>
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″>
<title>Untitled Document</title>

<style type=”text/css”>
#list {
margin:0px;
width:200px;
height:310px;
overflow:auto;}

#list div {
width:170px;
height:300px;
border-width:1px;
border-style:dashed;
border-color:#000
}
#list a {display:block}

</style>
</head>

<body>

<div id=”list”>
<div>
<h4>~~ header1 ~~</h4>
<a href=”#”>link</a>
<a href=”#”>link</a>
<a href=”#”>link</a>
<a href=”#”>link</a>

<h4>~~ header2 ~~</h4>
<a href=”#”>link</a>
<a href=”#”>link</a>
<a href=”#”>link</a>
<a href=”#”>link</a>
<a href=”#”>link</a>
<a href=”#”>link</a>
<a href=”#”>link</a>
<a href=”#”>link</a>
<a href=”#”>link</a>
<a href=”#”>link</a>
<a href=”#”>link</a>
<a href=”#”>link</a>
<a href=”#”>link</a>
</div>
</div>

</body>
</html>
[/code]

thanks for replying

to post a comment
CSS

6 Comments(s)

Copy linkTweet thisAlerts:
@drhowarddrfineJul 12.2006 — You have limited your list with the height and FF is doing exactly what you told it to do while IE, as usual, is screwing it up. Remove the height rules and see what happens. You said to overflow the content and FF does while IE just expanded the div which is not what you said to do.
Copy linkTweet thisAlerts:
@SiddanauthorJul 12.2006 — hmm hehe, well. This how I thought I told it to do...

I have the divwrapper of a fixed width and height setting it to overflow. Then I have another div container which is for the whole content, and that content has a border which should be all around the text within.

So no matter how long the content is stretching beyond the bottom of the divwrapper, the bottom border of the content should follow its length...

..... should it not?
Copy linkTweet thisAlerts:
@drhowarddrfineJul 13.2006 — overflow only specifies what to do with the content when it overflows its container. You specify the container to be a certain height so FF properly stops the div as you told it to. IE does not which is incorrect behavior.
Copy linkTweet thisAlerts:
@SiddanauthorJul 13.2006 — lol, I still could argue with you of how it should be but luckily I checked the code again and to my embarrasing surprise there were one fixed height of each of those divs. I only concentrated on the first #list div and apparently got blind on the second div.

so in short, I did the mistake of somehow setting the second div a height
Copy linkTweet thisAlerts:
@drhowarddrfineJul 13.2006 — I still could argue with you of how it should be[/QUOTE]This is the abuse forum. Arguments are on a different board. :p

How what should be? I'm up to correcting you. :rolleyes:
Copy linkTweet thisAlerts:
@SiddanauthorJul 14.2006 — lol. I meant if there were no fixed height on the second div and the border would still behave like that. Cus all you said was that Firefox is reading and does what is correct.. but how can it be correct when the wrapper div only has a fixed height and not the content div, and still the content div´s border ends the end of the wrapper´s div...

do you see our misscomunication? :p

So then I saw that the second div also had a fixed height, which wasn´t in my attention
×

Success!

Help @Siddan 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.5,
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: @Yussuf4331,
tipped: article
amount: 1000 SATS,

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

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...