/    Sign up×
Community /Pin to ProfileBookmark

Tables in Mozilla

Copy linkTweet thisAlerts:
Dec 26.2005

I have a table that stretches the widht of the screen and has multiple cells. I am trying to place in one cell content that may potentially overflow the dimensions of the cell.

If I put OVERFLOW: hidden in the style of the cell, the cell ignores this and stretches to the dimensions of the content.

I tried putting a <div style=’POSITION: absolute; LEFT: 0px; TOP: 0px; WIDTH: 100%; HEIGHT: 100%; OVERFLOW: hidden’> tag around the cell content, and it works pefectly well in IE, but fails in Mozilla (IE inteprets HEIGHT: 100% in relation to the height of the cell, whereas Mozilla inteprets it in relation to the entire screen – why???).

Could someone advise how to achieve this – apparently not so simple – task?

Thanks in advance…

to post a comment
CSS

3 Comments(s) ↴

Copy linkTweet thisAlerts:
@VicauthorDec 26.2005 — In supplement to the question above - I tried to force the dimensions of the table by using TABLE-LAYOUT: fixed attribute, and it again renders nicely in IE, but completely messes up in Mozilla. I'm not sure why this happens?
Copy linkTweet thisAlerts:
@VicauthorDec 26.2005 — How is HEIGHT style interpreted in Mozilla? According to W3C:
height: percentage - Integer followed by a percent sign (%). The value is a percentage of the height of the parent object, which must be specified explicitly. Negative values are not allowed.[/QUOTE]

But when I create the following:
[CODE]<table cellSpacing=0 cellpadding=0 style='WIDTH: 100%; HEIGHT: 100%'>
<tr style='HEIGHT: 50px'><td>
<div style='WIDTH: 100%; height: 100%; overflow: hidden'><img src='images/picture.gif'></div>
</td></tr>
<tr><td>Rest of the Table</td></tr>
</table>[/CODE]

The height of the first row corresponds to the height of the PICTURE not 50px as specified. Again, this works well in IE and only fails in Mozilla.
Copy linkTweet thisAlerts:
@ShrineDesignsDec 26.2005 — &lt;div style='position: absolute; width: 100%; height: 100%; overflow: hidden'&gt;...&lt;/div&gt;
×

Success!

Help @Vic 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.2,
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,
)...