I've been reluctant to ask these questions, not because of any lack
of faith in the wonderful people on this list, but because I can't
give you the opportunity to see the page for yourself, and I don't
think it's entirely fair to ask you to fix something you can't see.
But, this has reached a point where I really don't have any choice.
The web page is part of our corporate employees only web site. You
need an account to access it. Could I move it to a public site. Not
easily. There is a MySQL database attached that would have to be
moved, MySQL installed, PHP installed. Probably isn't going to happen.
Background. This page is a corporate phone book. Name, phone number,
email address, office location, etc. Data are stored in the database.
Retrieving the data is working just fine. PHP is used extensively,
but I have removed the PHP from below to reduce the clutter. PHP is
not the problem. (Try of focus on the CSS, not the html. I may have
done something in removing the PHP that doesn't make any sense. Don't
let that worry you unless that may contribute to the problem.
The problem. At the top of the page is a typical header - last
modification date, how to request changes, etc. and a form where you
can select a particular department you want to see, along with a
submit button, and finally column headers for the data that follows.
Below all this is the data. My goal is to have the header fixed at
the top of the page, and have the data scroll.
In FF this works "OK". The only problem is that the data scrolls
under the header rather than being cut off before it gets to the
header. The downside is if you perform a search, the found row in the
table may be under the header and not visible.
A second problem is that with IE, the header scrolls off with the
data. I can live with this, if a lot of work is required to "tame" IE.
The last problem is that on various platforms, there are varying
amounts of space between the bottom of the header and the first line
of the table. I've set the spacing so that on all browsers, the first
row is visible. On other browsers, that leaves a big (more than an
inch) gap.
So, what I'd like to do is a) eliminate the gap, or reduce it as much
as possible, b) have the data not scroll under the header, and c) if
not too difficult, tame IE so that header doesn't scroll.
Is any of this fixable?
-----===== Bill =====-----
<style type="text/css">
.black
{
color:black;
}
.red
{
color:red;
}
H2
{
margin-bottom : 0px;
margin-top : 0px;
}
table.main
{
border: none;
width: 100%;
}
html, body
{
margin:0;
padding:0;
height:100%; /* 100 % height */
}
html>body #wrap
{
height:100%; /* 100 % height */
}
#header
{
width:100%;
height:11.5em;
padding:4 0 0 0;
}
html>body #header
{
position:fixed;
z-index:10; /* Prevent certain problems with form controls */
}
html>body #content-wrap
{
height:100%; /* 100 % height */
}
html>body #content
{
padding:11.5em 1em 0 0; /* 6em = height of #header and #footer +
1em, 1em = give the con
}
#footer
{
width:100%;
height:5em;
}
html>body #footer
{
position:fixed;
bottom:0;
z-index:10; /* Prevent certain problems with form controls */
}
#header, #footer
{
background: #8FFFFF none repeat scroll 0%;
text-align:center;
}
<!--[if lt IE 7]>
<link rel="stylesheet" href="ie.css" type="text/css">
<![endif]-->
</style>
<body style="background-color: #8FFFFF;">
<div id="wrap">
<div id="header">
******** Some PHP code to access a connect to a database
<div style="float: left; width:20%;"> </div>
<div style="float: right; width:20%;"><font size=2>This information
last modified {$md}
</font></div>
<div style="text-align:center;"><h2>SGT Phone Directory</h2>
<p style="text-align:center;">Comments about and/or changes to
the Phone Directory should be submitted using our <a
href="emp_info.php">phone book form</a>.<br>
To see employees from one department, select that department from
this list and click on submit.<br>
<form action = "{$file_name}" method="post">
<select name="department">
******** PHP code to query the database and set up the form
</select>
<input type='submit' value='Submit'>
</form>
</div>
********* PHP code to query the database and read names, phone numbers, et.
<div style="text-align:center;">
Number of employees found: $numRows
</div>
</p>
<table width="100%" border=0 align=center>
<tr>
<td width="20%" align=left>$col0_hdr</td>
<td width="10%" align=left>$col1_hdr</td>
<td width="25%" align=left>$col3_hdr</td>
<td width="25%" align=left>$col2_hdr</td>
<td width="10%" align=left>$col4_hdr</td>
<td width="10%" align=left>$col5_hdr</td>
<td width="10%" align=left>$col4_hdr</td>
<td width="10%" align=left>$col5_hdr</td>
</tr>
</table>
</div>
<div id="content-wrap">
<div id="content">
</div>
<table class="main">
<tr>
<td width="20%"> </td>
<td width="10%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="10%"> </td>
<td width="10%"> </td>
</tr>
<tr>
<td align=center colspan=6>
</td>
<tr>
<td nowrap class="black">$name</td>
<td nowrap>$phone</td>
<td nowrap>$email</td>
<td nowrap>$location</td>
<td nowrap>$fax</td>
<td nowrap>$comp</td>
</tr>
</table>
</div>
</div>
</div>
--
The path to enlightenment requires a flashlight with fresh batteries.
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
