...

View Full Version : Table Fieldset Spacing IE FF



jerry62704
07-08-2008, 04:08 PM
I have a page that has a table inside of a fieldset. The fieldset removes the horizonal scroll bar from FF (it's not visible in IE), but the spacing is problematic. There must be space for 10 characters between the edge of the fieldset and the vertical scroll bar. Same on the left side as well.

How can I get rid of this extra spacing?

HTML (removing header, footer and navigation (left) divs):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>
<link rel="stylesheet" type="text/css"
href="http://localhost:9080/RIN/css/RIN.css">

<title>Illinois DHS Recipient ID Pending Requests</title>

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="GENERATOR" content="Rational Application Developer">
</head>

<body>
<!--[if IE]> <div id="IEbugs"> <![endif]-->

<div id="container">
<div id="content">
<h1 class="center">
Recipient Identification Number (RIN) System</h1>

<h2 class="center">
View Pending <acronym title="electronic Recipient ID Number">RIN</acronym> Requests</h2>
<div class="clearAll"></div>

<div class='oneOfTwo'>Client Name</div>
<div class='twoOfTwo'>Submission Date</div>
<div id='scrollTable'>
<fieldset>
<table border='0' cellpadding='0' cellspacing='0' summary='RIN Pending Request Client names and submission dates' class='center' title='RIN Pending Requests'>
<caption>Pending Requests Listing</caption>
<tr>
<td class='paddingRight evenline textRight' title='Eric Moore
Client Info'>Eric Moore</td>
<td class='evenline textLeft' title='05/16/2008 13:22:11 am
Submission Date'>05/16/2008 13:22:11 am</td>
</tr>
<tr>
<td class='paddingRight oddline textRight' title='Gregory Sanders
Client Info'>Gregory Sanders</td>
<td class='oddline textLeft' title='05/07/2008 12:16:13 am
Submission Date'>05/07/2008 12:16:13 am</td>
</tr>
<tr>
<td class='paddingRight evenline textRight' title='Paul Bellan
Client Info'>Paul Bellan</td>
<td class='evenline textLeft' title='04/12/2008 12:16:13 am
Submission Date'>04/12/2008 12:16:13 am</td>
</tr>
<tr>
<td class='paddingRight oddline textRight' title='Jerry Davidson
Client Info'>Jerry Davidson</td>
<td class='oddline textLeft' title='04/13/2008 12:16:13 am
Submission Date'>04/13/2008 12:16:13 am</td>
</tr>
<tr>
<td class='paddingRight evenline textRight' title='KELLEIGH DEMONBRUN
Client Info'>KELLEIGH DEMONBRUN</td>
<td class='evenline textLeft' title='03/15/2008 22:16:13 am
Submission Date'>03/15/2008 22:16:13 am</td>
</tr>
<tr>
<td class='paddingRight oddline textRight' title='MIKE BARNES
Client Info'>MIKE BARNES</td>
<td class='oddline textLeft' title='03/18/2008 22:18:13 am
Submission Date'>03/18/2008 22:18:13 am</td>
</tr>
<tr>
<td class='paddingRight evenline textRight' title='Ming LIU
Client Info'>Ming LIU</td>
<td class='evenline textLeft' title='02/20/2008 12:16:11 am
Submission Date'>02/20/2008 12:16:11 am</td>
</tr>
<tr>
<td class='paddingRight oddline textRight' title='MIKE NORRIS
Client Info'>MIKE NORRIS</td>
<td class='oddline textLeft' title='02/23/2008 12:11:13 am
Submission Date'>02/23/2008 12:11:13 am</td>
</tr>
<tr>
<td class='paddingRight evenline textRight' title='Labeaux Schiek
Client Info'>Labeaux Schiek</td>
<td class='evenline textLeft' title='01/14/2008 12:16:12 am
Submission Date'>01/14/2008 12:16:12 am</td>
</tr>
<tr>
<td class='paddingRight oddline textRight' title='Theodore Morris
Client Info'>Theodore Morris</td>
<td class='oddline textLeft' title='01/27/2008 12:16:13 am
Submission Date'>01/27/2008 12:16:13 am</td>
</tr>
<tr>
<td class='paddingRight evenline textRight' title='Eric Moore2
Client Info'>Eric Moore2</td>
<td class='evenline textLeft' title='05/16/2008 13:22:11 am
Submission Date'>05/16/2008 13:22:11 am</td>
</tr>
<tr>
<td class='paddingRight oddline textRight' title='Gregory Sanders2
Client Info'>Gregory Sanders2</td>
<td class='oddline textLeft' title='05/07/2008 12:16:13 am
Submission Date'>05/07/2008 12:16:13 am</td>
</tr>
<tr>
<td class='paddingRight evenline textRight' title='Paul Bellan2
Client Info'>Paul Bellan2</td>
<td class='evenline textLeft' title='04/12/2008 12:16:13 am
Submission Date'>04/12/2008 12:16:13 am</td>
</tr>
<tr>
<td class='paddingRight oddline textRight' title='Jerry Davidson2
Client Info'>Jerry Davidson2</td>
<td class='oddline textLeft' title='04/13/2008 12:16:13 am
Submission Date'>04/13/2008 12:16:13 am</td>
</tr>
<tr>
<td class='paddingRight evenline textRight' title='KELLEIGH DEMONBRUN2
Client Info'>KELLEIGH DEMONBRUN2</td>
<td class='evenline textLeft' title='03/15/2008 22:16:13 am
Submission Date'>03/15/2008 22:16:13 am</td>
</tr>
<tr>
<td class='paddingRight oddline textRight' title='MIKE BARNES2
Client Info'>MIKE BARNES2</td>
<td class='oddline textLeft' title='03/18/2008 22:18:13 am
Submission Date'>03/18/2008 22:18:13 am</td>
</tr>
<tr>
<td class='paddingRight evenline textRight' title='Ming LIU2
Client Info'>Ming LIU2</td>
<td class='evenline textLeft' title='02/20/2008 12:16:11 am
Submission Date'>02/20/2008 12:16:11 am</td>
</tr>
<tr>
<td class='paddingRight oddline textRight' title='MIKE NORRIS2
Client Info'>MIKE NORRIS2</td>
<td class='oddline textLeft' title='02/23/2008 12:11:13 am
Submission Date'>02/23/2008 12:11:13 am</td>
</tr>
<tr>
<td class='paddingRight evenline textRight' title='Labeaux Schiek2
Client Info'>Labeaux Schiek2</td>
<td class='evenline textLeft' title='01/14/2008 12:16:12 am
Submission Date'>01/14/2008 12:16:12 am</td>
</tr>
<tr>
<td class='paddingRight oddline textRight' title='Theodore Morris2
Client Info'>Theodore Morris2</td>
<td class='oddline textLeft' title='01/27/2008 12:16:13 am
Submission Date'>01/27/2008 12:16:13 am</td>
</tr>
<tr>
<td class='paddingRight evenline textRight' title='Eric Moore3
Client Info'>Eric Moore3</td>
<td class='evenline textLeft' title='05/16/2008 13:22:11 am
Submission Date'>05/16/2008 13:22:11 am</td>
</tr>
<tr>
<td class='paddingRight oddline textRight' title='Gregory Sanders3
Client Info'>Gregory Sanders3</td>
<td class='oddline textLeft' title='05/07/2008 12:16:13 am
Submission Date'>05/07/2008 12:16:13 am</td>
</tr>
<tr>
<td class='paddingRight evenline textRight' title='Paul Bellan3
Client Info'>Paul Bellan3</td>
<td class='evenline textLeft' title='04/12/2008 12:16:13 am
Submission Date'>04/12/2008 12:16:13 am</td>
</tr>
<tr>
<td class='paddingRight oddline textRight' title='Jerry Davidson3
Client Info'>Jerry Davidson3</td>
<td class='oddline textLeft' title='04/13/2008 12:16:13 am
Submission Date'>04/13/2008 12:16:13 am</td>
</tr>
<tr>
<td class='paddingRight evenline textRight' title='KELLEIGH DEMONBRUN3
Client Info'>KELLEIGH DEMONBRUN3</td>
<td class='evenline textLeft' title='03/15/2008 22:16:13 am
Submission Date'>03/15/2008 22:16:13 am</td>
</tr>
<tr>
<td class='paddingRight oddline textRight' title='MIKE BARNES3
Client Info'>MIKE BARNES3</td>
<td class='oddline textLeft' title='03/18/2008 22:18:13 am
Submission Date'>03/18/2008 22:18:13 am</td>
</tr>
<tr>
<td class='paddingRight evenline textRight' title='Ming LIU3
Client Info'>Ming LIU3</td>
<td class='evenline textLeft' title='02/20/2008 12:16:11 am
Submission Date'>02/20/2008 12:16:11 am</td>
</tr>
<tr>
<td class='paddingRight oddline textRight' title='MIKE NORRIS3
Client Info'>MIKE NORRIS3</td>
<td class='oddline textLeft' title='02/23/2008 12:11:13 am
Submission Date'>02/23/2008 12:11:13 am</td>
</tr>
<tr>
<td class='paddingRight evenline textRight' title='Labeaux Schiek3
Client Info'>Labeaux Schiek3</td>
<td class='evenline textLeft' title='01/14/2008 12:16:12 am
Submission Date'>01/14/2008 12:16:12 am</td>
</tr>
<tr>
<td class='paddingRight oddline textRight' title='Theodore Morris3
Client Info'>Theodore Morris3</td>
<td class='oddline textLeft' title='01/27/2008 12:16:13 am
Submission Date'>01/27/2008 12:16:13 am</td>
</tr>
</table>
</fieldset>
</div><!-- scroll table -->
<div class='center'><p style='margin-top:5px;'>Pending RIN requests: 30</p></div>

</div> <!-- content -->
</div> <!-- container -->
<!-- below /div is for MS Explorer only -->
<!--[if IE]> </div> <![endif]-->

</body>

</html>

css:

* {
margin: 0;
padding: 0;
border: 0;
}

body {
background-color: #ffff99;
font-family: Verdana, Arial, sans-serif;
font-size: 130%;
}

#IEBugs body {
font-size: 90%;
}

h1, h2, h3 {
margin-top: .5em;
margin-bottom: .5em;
font-weight: 600;
color: #3333FF;
font-size: 120%;
}

#IEBugs h1, #IEBugs h2, #IEBugs h3 {
font-size: 95%;
}

h3 {
font-style: italic;
}

input {
padding-left: 0.3em;
font-size: 100%;
}

#IEBugs input {
font-size: 73%;
}

legend {
font-style: italic;
font-size: 70%;
font-weight: bolder;
margin-left: 10px;
}

fieldset {
border: 2px inset #3333ff;
color: #3333ff;
width: 80%;
margin-left: 10%;
margin-bottom: 10px;
padding-bottom: 10px;
}

caption {
font-size: 100%;
}

#IEBugs caption {
font-size: 80%;
}

table {
font-size: 85%;
}

#IEBugs table {
font-size: 60%;
}

p {
font-size: 60%;
}

/***********************************************/
/* *** "id" styles (one time DIV ID="xxx") *** */
#container {
width: 100%;
height: 100%;
}

#header {
width: 100%;
float: left;
clear: both;
}

#headerAgency {
float: left;
height: 24px;
margin: 4px 0 4px 4px;
}

#headerAgencyLogo {
float: left;
margin-right: 20px;
}

#headerAgencyText {
float: left;
font-weight: bold;
font-size: 11px;
line-height: 100%;
clear: right;
}

#headerNavBar {
height: 32px;
width: 100%;
background-repeat: repeat;
background-attachment: scroll;
background-image: url("http://localhost:9080/RIN/images/TabBarBackground.gif");
}

#headerBottom {
background-repeat: no-repeat;
background-attachment: scroll;
background-image: url("http://localhost:9080/RIN/images/BannerBackground.jpg");
height: 100px;
width: 100%;
clear: both;
position: relative;
z-index: 0;
}

#headerBottomText {
position: absolute;
bottom: 0;
color: #ffffff;
padding: 0 300px 4px 12px;
font-size: 120%;
font-weight: bold;
}

#IEBugs #headerBottomText {
font-size: 110%;
}

#headerBottomLogo {
position: absolute;
right: 0;
top: 0;
height: 100px;
}

#navigation {
float: left;
width: 110px;
height: 70%;
}

#navigation .input {
padding: 0;
}

#navigationPosition {
position: relative;
top: 35%;
}

#IEBugs #navigationPosition {
top: 110%;
}

#content {
margin: 10px 0 10px 10px;
float: left;
border: 3px double #3333ff;
width: 82%;
height: 70%;
overflow: hidden;
}

#content .oneOfTwo {
margin-bottom: 5px;
margin-left: 4.75%;
text-align: right;
width: 40%;
float: left;
border-bottom: 1px dashed #000000;
}

#IEBugs #content .oneOfTwo {
font-size: 70%;
margin-left: 2.5%;
}

#content .twoOfTwo {
margin-bottom: 5px;
margin-left: 4%;
float: left;
width: 40%;
border-bottom: 1px dashed #000000;
}

#IEBugs #content .twoOfTwo {
font-size: 70%;
margin-left: 4.5%;
}

#content .oneOfThree {
margin-bottom: 5px;
margin-left: 6.5%;
text-align: right;
width: 30%;
float: left;
border-bottom: 1px dashed #000000;
}

#IEBugs #content .oneOfThree {
font-size: 70%;
margin-left: 2%;
}

#content .twoOfThree {
margin-bottom: 5px;
margin-left: 2%;
text-align: right;
width: 16%;
float: left;
border-bottom: 1px dashed #000000;
}

#IEBugs #content .twoOfThree {
font-size: 70%;
margin-left: 2%;
}

#content .threeOfThree {
margin-bottom: 5px;
margin-left: 2%;
text-align: left;
width: 30%;
float: left;
border-bottom: 1px dashed #000000;
}

#IEBugs #content .threeOfThree {
font-size: 70%;
margin-left: 2%;
}

#content form {
margin-top: 2em;
}

#scrollTable {
overflow: auto;
width: 90%;
margin-left: 5%;
height: 60%;
clear: both;
}

#scrollTableBig {
overflow: auto;
width: 95%;
margin-left: 2.5%;
height: 60%;
clear: both;
}

#footer {
font-size: 70%;
padding-bottom: .25em;
padding-left: .5em;
margin-top: .25em;
width: 100%;
float: left;
clear: both;
}

#footer li {
display: inline;
list-style-type: none;
color: #333333;
}

#footer h2 {
position: absolute;
left: -1000em;
}

/************************************/
/* *** classes (multi-use able) *** */
.clearAll {
clear: both;
}

.clearLeft {
clear: left;
}

.clearRight {
clear: right;
}

.left {
float: left;
text-align: right;
margin-left: .5em;
margin-top: .5em;
width: 8em;
height: 1.1em;
}

#IEBugs .left {
height: 1em;
font-size: 75%;
}

.right {
float: left;
text-align: left;
margin-top: .5em;
margin-left: .25em;
width: 8em;
}

.center {
text-align: center;
width: 100%;
}

.textLeft {
text-align: left;
}

.textRight {
text-align: right;
}

.errors {
color: #ff0000;
font-size: .75em;
font-weight: bold;
text-align: center;
width: 70%;
border: 3px inset;
margin-left: 15%;
}

.button {
width: 110px;
font-weight: 600;
height: 30px;
padding: 0;
margin-top: .3em;
border: 1px solid #000000;
}

.paddingRight {
padding-right: 20px;
width: 50%;
}

.evenline {
background-color: #ffd700;
}

.oddline {
background-color: #daa520;
}

.underline {
border-bottom: 1px solid black;
}

This is driving me crazy. If you want to reduce the number of people in the mental health facility, please help.

jerry62704
07-08-2008, 06:51 PM
Found the majority of the solution. Unanswered is why when the fieldset is set to less than 100&#37;, the horizonal scroll bar goes away and why it was there in the first place.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum