469,362 Members | 2,441 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,362 developers. It's quick & easy.

Problems with table width in IE


I have the following style:

..content {position: absolute; right: 10px; left: 170px; top: 135px;
padding-left: 0px;
color: #15447c;}

..content table {width: 100%; background: BLUE; color: WHITE;}
The table in Firefox is set to 100% of the content class. In IE it is
set to 100% of the browser window and causes ugly scroll bars to appear
all over the place. I created the simple example page below to see if
it was something in my own page (very complex css and html) or
something isolated.

http://www.dubyadubyadubyadotcom.com/gah/

Can somebody please help me out - how do I set a table to 100% here and
have it work in IE? At the moment everything is smashed together in
the table in my actual app because I cant set the width and it really
looks bad. I have basically converted the app from a non-complient
HTML to a CSS//Standards drive dealio and this is the only table on the
site however one that cannot be replaced (thats out of my hands). What
do I do here?

J

Jul 21 '05 #1
8 16931
st******@gmail.com wrote:
I have the following style:

.content {position: absolute; right: 10px; left: 170px; top: 135px;
padding-left: 0px;
color: #15447c;}

.content table {width: 100%; background: BLUE; color: WHITE;}
The table in Firefox is set to 100% of the content class. In IE it is
set to 100% of the browser window and causes ugly scroll bars to appear
all over the place. I created the simple example page below to see if
it was something in my own page (very complex css and html) or
something isolated.

http://www.dubyadubyadubyadotcom.com/gah/


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN"
"http://www.w3.org/TR/html4/loose.dtd">

a new doctype ?

and somewhere you are missing a </div>
Jul 21 '05 #2
I added the </div> tried with the original doctype as well as the one I
currentyl have with identical results. My HTML and CSS Validate
............

I am at a total loss

Jul 21 '05 #3
ManChild wrote:
I added the </div> tried with the original doctype as well as the one I
currentyl have with identical results. My HTML and CSS Validate
...........

I am at a total loss


use a correct doctype

http://www.w3.org/QA/2002/04/valid-dtd-list.html

for instance:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

or:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

better not mix them.
Jul 21 '05 #4
Checked out a few -- the same crap no matter what one I use.

Jul 21 '05 #5
ManChild wrote:
Checked out a few -- the same crap no matter what one I use.

dont know if the absolute positioning is relevant, but if not you could
use somthing like:

<div style="margin: 0px 20px 0px 170px;">
<table style="width: 100%; background: green; color: WHITE;">
<tr>
<td>
Content Content Content Content Content Content Content Content
Content Content Content Content Content Content Content Content Content
Content Content Content Content Content Content Content Content Content
Content Content Content Content Content Content Content Content Content
Content Content Content Content Content Content Content Content Content
Content Content Content Content Content Content Content Content Content
Content Content Content Content Content Content Content Content Content
Content Content Content Content
</td>
</tr>
</table>
</div>
Jul 21 '05 #6
ManChild wrote:
Checked out a few -- the same crap no matter what one I use.


How about this:

<style type="text/css">
body{
width: 100%;
margin: 0;
padding: 0;
border: 0;
}
..content {
position: absolute;
right: 10px;
left: 170px;
top: 135px;
padding: 0;
margin: 0;
border: 0;
color: #15447c;
text-align: left;
}
..content table {
left: 0;
top: 0;
background: BLUE;
color: WHITE;
padding: 0;
margin: 0;
border: 0;
}
..content a:link {color: #15447c; text-decoration: underline;}
..content a:visited {color: #15447c; text-decoration: underline;}
..content a:hover {color: #ff99cc; text-decoration: underline;}
..content a:active {color: #15447c; text-decoration: underline;}
</style>
Jul 21 '05 #7
Awesome -- thank you sir.

I must admit it is not something I was likely to have ever come up with
myself but it does work, and it is browser specific.

Gotta say this CSS stuff has actually made my life more difficult, it
was all fun till I loaded my first pages in IE and other browsers :D

Jul 21 '05 #8
*is not browser specific*

Jul 21 '05 #9

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

reply views Thread by Michael Fork | last post: by
4 posts views Thread by Alex Meier | last post: by
reply views Thread by DAnne | last post: by
1 post views Thread by chr.aleksander | last post: by
reply views Thread by Derty | last post: by
34 posts views Thread by aljamala | last post: by
1 post views Thread by CARIGAR | last post: by
reply views Thread by zhoujie | last post: by
reply views Thread by suresh191 | last post: by
1 post views Thread by Marylou17 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.