Closed Bug 347130 Opened 18 years ago Closed 18 years ago

border of table cells is drawn partially outside of a surrounding div

Categories

(Core :: Layout: Tables, defect)

x86
Linux
defect
Not set
normal

Tracking

()

RESOLVED DUPLICATE of bug 155955

People

(Reporter: rosen, Unassigned)

Details

(Keywords: testcase)

Attachments

(1 file)

User-Agent:       Mozilla/5.0 (X11; U; Linux i686; de; rv:1.8.0.5) Gecko/20060719 Firefox/1.5.0.5
Build Identifier: Mozilla/5.0 (X11; U; Linux i686; de; rv:1.8.0.5) Gecko/20060719 Firefox/1.5.0.5

the border of a table is drawn partially outside of a surrounding div. with overflow:hidden on the div, the border is clipped.
with overflow:hidden and a minimum border-width of 3px on a td, the content of a td is clipped.

Reproducible: Always

Steps to Reproduce:
see attachment


Expected Results:  
the table and it's border should be inside of the surrounding div.
Does this happen on trunk builds?

If so, can you attach a minimal testcase?
- https://bugzilla.mozilla.org/attachment.cgi?bugid=347130&action=enter
i can't attach the test-case because of a bug in bugzilla ;-)
so here it is:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
          "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Test</title>
<style type="text/css">	
div,p,body {
	font-family:arial,helvetica;
	font-size:10pt;
	text-align:left;
}
#noclip,#clip {
	background:red;
	width:300px;
	height:100px;
}
#noclip2 {
	background:red;
	width:300px;
}
#clip {
	overflow:hidden;
}

table {
	border-collapse:collapse;
	table-layout:fixed;
	width:300px;
	border-spacing:0px;
	background:yellow;
}
td {
	border:10px solid black;
	padding:0px;
	overflow:hidden;
}
</style>
<script type="text/javascript">
function showSize() {

}
</script>
</head>
<body onLoad="showSize()">

<p>
The border is drawn outside of the surrounding red div.

<div id="noclip">
<table id="tnoclip" cellspacing="0">
<tr><td>content</td><td>content</td><td>content</td></tr>
<tr><td>content</td><td>content</td><td>content</td></tr>
<tr><td>content</td><td>content</td><td>content</td></tr>
</table>
</div>

<p>
The height of the div is calculated wrong.

<div id="noclip2">
<table id="tnoclip" cellspacing="0">
<tr><td>content</td><td>content</td><td>content</td></tr>
<tr><td>content</td><td>content</td><td>content</td></tr>
<tr><td>content</td><td>content</td><td>content</td></tr>
</table>
</div>

<p>
With overflow:hidden the border is clipped.

<div id="clip">
<table id="tclip" cellspacing="0">
<tr><td>content</td><td>content</td><td>content</td></tr>
<tr><td>content</td><td>content</td><td>content</td></tr>
<tr><td>content</td><td>content</td><td>content</td></tr>
</table>
</div>

<p>
In all examples the cell-content is clipped. This only happens with
overflow:hidden set for td and a minimum border-width of 3px.

</body>
</html>
Keywords: testcase

*** This bug has been marked as a duplicate of 155955 ***
Status: UNCONFIRMED → RESOLVED
Closed: 18 years ago
Resolution: --- → DUPLICATE
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: