 |
|
|
| View previous topic :: View next topic |
| Author |
Message |
mlotfi
Joined: 10 Oct 2008
Posts: 2
|
 Posted: Fri Oct 10, 2008 12:40 pm Please help me fix this html page. |
 |
|
|
Hi,
Could you please help me fix this html page, it looks too big in the Internet Explorer browser :
| Code: |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
div.tableContainer {
width: 98%; /* table width will be 99% of this*/
height: 98%; /* must be greater than tbody*/
overflow: auto;
margin: 0 auto;
}
table {
width: 99%; /*100% of container produces horiz. scroll in Mozilla*/
border: none;
background-color: #f7f7f7;
}
table>tbody { /* child selector syntax which IE6 and older do not support*/
overflow: auto;
height: 250px;
overflow-x: hidden;
}
thead tr {
position:relative;
top: expression(offsetParent.scrollTop); /*IE5+ only*/
}
thead td, thead th {
text-align: center;
font-size: 14px;
background-color: oldlace;
color: steelblue;
font-weight: bold;
border-top: solid 1px #d8d8d8;
}
td {
color: #000;
padding-right: 2px;
font-size: 12px;
text-align: center;
border-bottom: solid 1px #d8d8d8;
border-left: solid 1px #d8d8d8;
}
table tfoot tr { /*idea of Renato Cherullo to help IE*/
position: relative;
overflow-x: hidden;
top: expression(parentNode.parentNode.offsetHeight >=
offsetParent.offsetHeight ? 0 - parentNode.parentNode.offsetHeight + offsetParent.offsetHeight + offsetParent.scrollTop : 0);
}
tfoot td {
text-align: center;
font-size: 11px;
font-weight: bold;
background-color: papayawhip;
color: steelblue;
border-top: solid 1px slategray;
}
td:last-child {padding-right: 20px;} /*prevent Mozilla scrollbar from hiding cell content*/
</style>
</head>
<body>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="30%">
<div class="tableContainer" align="center">
<table cellspacing="0" align="center">
<thead>
<tr>
<td>Users</td>
</tr>
</thead>
<tbody >
<tr>
<td><a href="userRoles">user0</a></td>
</tr>
<tr>
<td><a href="userRoles">user1</a></td>
</tr>
<tr>
<td><a href="userRoles">user2</a></td>
</tr>
<tr>
<td><a href="userRoles">user3</a></td>
</tr>
<tr>
<td><a href="userRoles">user4</a></td>
</tr>
<tr>
<td><a href="userRoles">user5</a></td>
</tr>
<tr>
<td><a href="userRoles">user6</a></td>
</tr>
<tr>
<td><a href="userRoles">user7</a></td>
</tr>
<tr>
<td><a href="userRoles">user8</a></td>
</tr>
<tr>
<td><a href="userRoles">user9</a></td>
</tr>
<tr>
<td><a href="userRoles">user10</a></td>
</tr>
</tbody>
</table>
</div>
</td>
<td><table width="100%" height="100" border="1" cellpadding="0" cellspacing="0">
<tr>
<td><div align="center">Roles assigned to UserX</div>
<div class="tableContainer">
<table cellspacing="0">
<thead>
<tr>
<td width="18%">Role</td>
<td width="38%">Action</td>
</tr>
</thead>
<tbody>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
</tbody>
</table>
</div></td>
</tr>
<tr>
<td><div align="center">Roles Not assigned to UserX</div>
<div class="tableContainer">
<table cellspacing="0">
<thead>
<tr>
<td width="18%">Role</td>
<td width="38%">Action</td>
</tr>
</thead>
<tbody>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
<tr>
<td>role</td>
<td><a href="revokeAction">Revoke</a></td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>
|
|
|
PayneLess Designs
Joined: 28 Feb 2007
Posts: 1210
Location: Biloxi, MS
|
| Posted: Fri Oct 10, 2008 2:36 pm |
|
|
|
Can you explain more as to what you mean by " it looks too big" in IE as it looks ok to me. Layout of page looks way different in Firefox than IE.
Does have lots of CSS errors:
| Quote: |
21 table > tbody Property overflow-x doesn't exist in CSS level 2.1 but exists in [css3] : hidden
26 thead tr Value Error : top Parse Error offsetParent.scrollTop)
32 thead td, thead th Value Error : background-color oldlace is not a color value : oldlace
33 thead td, thead th Value Error : color steelblue is not a color value : steelblue
49 table tfoot tr Property overflow-x doesn't exist in CSS level 2.1 but exists in [css3] : hidden
51 table tfoot tr Value Error : top Lexical error at line 51, column 32. Encountered: "?" (63), after : "" ? 0 - parentNode.parentNode.offsetHeight + offsetParent.offsetHeight + offsetParent.scrollTop : 0);
52 table tfoot tr Value Error : top Parse error - Unrecognized }
59 tfoot td Value Error : background-color papayawhip is not a color value : papayawhip
60 tfoot td Value Error : color steelblue is not a color value : steelblue
61 tfoot td Value Error : border-top slategray is not a color value : solid 1px slategray
64 Unknown pseudo-element or pseudo-class :last-child |
One HTML error. Height in table tag is not valid. |
|
|
|
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum
|
|
|
|
|
 |
|
|
|
|
|
|
|
Forum Home
FAQ
Search
Memberlist
Register
Profile
Log in to check your private messages
Log in
