468,103 Members | 1,206 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

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

problem with IE: display of table in three column layout

This is the page that I am putting together:

http://www.reiki-evolution.co.uk/dra...urse-dates.htm

The site consists of three columns: a sidebar floated left, a sidebar floated right, and the 'main content' which has wide margins to accommodate the floated sidebars.

I am working on the main content. I have information that needs to be displayed in a table. When I view the page in Firefox or Safari or Netscape I see what I intended, with the table restricted to the 'main content' div.

When I view the page in IE, the table begins below the content of the two sidebars and the table breaks free from the confines of the 'main content' div, ranging to the right and overlapping the right sidebar div.

Here is the CSS that I am using:
Expand|Select|Wrap|Line Numbers
  1. Setting up the divisions
  2. -----------------------------
  3.   #content {
  4.     background-color:white;
  5.     margin-left:15%;
  6.     margin-right:18%;
  7.     margin-bottom:0px;
  8.     padding:0 10px 10px 10px;
  9.     }
  10.  
  11.   #sidebar_b {
  12.     float:right;
  13.     width:15%;
  14.     margin-bottom:10px;
  15.     margin-top:10px;
  16.     padding:10px;
  17.     }
  18.  
  19.   #sidebar_a {
  20.     float:left;
  21.     width:12%;
  22.     margin-bottom:10px;
  23.     margin-top:10px;
  24.     padding:10px;
  25.     }
  26.  
  27. CSS for the Table
  28. -----------------------
  29.  
  30.    table #coursetab {
  31.     border:1px solid #333;
  32.     font: normal 1.0em 'Lucida Grande Unicode', 'Lucida Grande', Verdana, Arial, Sans-serif;
  33.     }
  34.  
  35.   #coursetab th, td {
  36.     border:1px solid #333;
  37.     padding:3px;
  38.     vertical-align:top;
  39.     }
  40.  
  41.   #coursetab th {
  42.     width:15%;
  43.     text-align:left;
  44.     color:purple;
  45.     background-color:#EDE9E9;
  46.     }
  47.  
  48.   #coursetab td {
  49.     background-color:#EDE9E9;
  50.     border-style:solid;
  51.     border-width:1px;
  52.     border-color:#FFF #AAA #666 #FFF;
  53.     }
  54.  
  55.   #coursetab tr th img {
  56.     width:80px;
  57.     margin-top:10px;
  58.     }
  59.  
HTML used for the table
------------------------------

<table id="coursetab" align="center">

followed by simple <tr>, <th>, <td> etc.




How do I persuade IE to display what I can see on Firefox, Safari etc?



Many thanks,



Taggart King
Aug 31 '07 #1
1 1641
drhowarddrfine
7,435 Expert 4TB
You will never get IE to pretend it's a modern browser without a proper doctype. See the article about doctypes under Articles above.

You also have 101 html errors that need to be fixed. Didn't check for css errors.
Aug 31 '07 #2

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

61 posts views Thread by Toby Austin | last post: by
2 posts views Thread by Richard Lissimore | last post: by
117 posts views Thread by phil-news-nospam | last post: by
5 posts views Thread by H J van Rooyen | last post: by
31 posts views Thread by Martin Clark | last post: by
3 posts views Thread by Steve | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.