471,618 Members | 1,487 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 471,618 software developers and data experts.

IE 6 Positioning Disaster

25
Hi there, I've uncovered a problem which I only have with IE6, surprise surprise. I have a centered layout for the main content of my web page and I am populating the main section with tabulated data pulled from a database. However, in IE6, the main section of the page is pushed to the left, while the background image (a gold box) i've used to contain the table data has been pushed out to the right.

The strange thing about this is that my other pages display fine in IE6, it seems that the dynamically created table is causing mayhem on this one page. I've checked through my code and can't see any problems - if anyone could help that would be greatly appreciated.

The page and source can be viewed at www.ttfgolf.com/members/top_courses.php (apologies if the table coding looks a bit messy, php is generating this for me and don't think i can affect the output format)

the css is as follows...

Expand|Select|Wrap|Line Numbers
  1. body {
  2.     background-image: url(ttf_background.jpg);
  3.     background-repeat: repeat-x;
  4.     font-size:1em;
  5.     height:100%;
  6. }
  7.  
  8. .container {
  9.     background-image: url(members_bground.jpg);
  10.     background-repeat:no-repeat;
  11.     font-family: Verdana, Arial, Helvetica, sans-serif;
  12.     font-size: 11px;
  13.     color: #FFFFFF;
  14.     width:843px; 
  15.     margin-left: auto; 
  16.     margin-right: auto;
  17.     text-align:center;
  18.     height:800px;
  19. }
  20.  
  21. .container p {
  22.     position:relative;
  23.     padding-top:30px;
  24. }
  25.  
  26. .menu {
  27.     position:relative;
  28.     top:80px;
  29. }
  30.  
  31. a:link {
  32.     color:#D5BE8B;
  33.     text-decoration:underline;
  34. }
  35.  
  36. a:visited {
  37.     color:#008200;
  38. }
  39.  
  40. a:hover {
  41.     color:#FFCC00;
  42. }
  43.  
  44. #content {
  45.     position:relative;
  46.     top:79px;
  47.     background-image: url(box.gif);
  48.     background-position:top center;
  49.     background-repeat:no-repeat;
  50. }
  51.  
  52. #content p {
  53.     margin-left:30px;
  54.     margin-right:30px;
  55.     padding-bottom:0;
  56.     text-align:left;
  57. }
  58.  
  59. #content #centertext {
  60.     margin-left:0px;
  61.     text-align:center;
  62. }
  63.  
  64. #loginform {
  65.     margin-left:200px;
  66.     margin-top:30px;
  67. }
  68.  
  69. label,input {
  70.     display: block;
  71.     width: 200px;
  72.     float: left;
  73.     margin-bottom: 20px;
  74. }
  75.  
  76. input[type="checkbox"] {
  77.     width:15px;
  78.     margin-left:30px;
  79. }
  80.  
  81. label {
  82.     text-align: right;
  83.     width: 175px;
  84.     padding-right: 20px;
  85. }
  86.  
  87. br {
  88.     clear: left;
  89. }
  90.  
  91. #loginform #formbuttons {
  92.     margin-left:177px;
  93.     padding-top:10px;
  94. }
  95.  
  96. #content #error {
  97.     color:red;
  98.     margin:0;
  99.     padding:0;
  100.     text-align:center;
  101. }
  102.  
  103. #loginform input[type = "submit"] {
  104.     margin-left:20px;
  105.     width:auto;
  106. }
  107.  
  108. /*golf course table styling*/
  109. #course_table {
  110.     margin-top:30px;
  111.     width: 750px;
  112.     margin-left:60px;
  113.     text-align:left;
  114.     border-collapse:collapse;
  115. }
  116.  
  117. #course_table th{    
  118.     color:#D5BE8B;
  119.     font-size:1.4em;
  120.     border-bottom:solid 2px #D5BE8B;
  121. }
  122.  
  123. #course_table td{
  124.     margin-bottom:0;
  125.     height:22px;
  126.     vertical-align:top;
  127. }
  128.  
  129. #course_table #checkbox {
  130.     height:5px;
  131. }
  132.  
  133. #course_table #rank {
  134.     padding-left:30px;;
  135. }
  136.  
  137. #course_submit {
  138.     margin-top: 40px;
  139.     margin-left:600px;
  140. }
  141.  
  142. .footer {
  143.     position:relative;
  144.     width:843px;
  145.     margin-top:2px;
  146.     height:56px;
  147.     margin-left: auto; 
  148.     margin-right: auto;
  149.     text-align:center;
  150.     font-family: Verdana, Arial, Helvetica, sans-serif;
  151.     font-size: 9px;
  152.     color: #FFFFFF;
  153.     background-image: url(banner_bottom.gif);
  154.     background-repeat: no-repeat;
  155. }
  156.  
  157. .footer img {
  158.     float:left;
  159. }
  160.  
  161. .footer p {
  162.     padding-top:3px;
  163. }
  164.  
  165.  
Sep 27 '07 #1
2 1698
drhowarddrfine
7,435 Expert 4TB
Validate for your list of 50 html errors that need correcting.
Sep 27 '07 #2
nicky77
25
thks for the reply - i had validated earlier today and couldn't see what could be causing my problem, realise i still should have corrected the errors though before posting - apologies. i've now corrected all of the errors apart from those relating to the properties of my flash menu as i'm not keen on messing around with them.

grateful for any help if you can see where the problem might lie
Sep 27 '07 #3

Post your reply

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

Similar topics

9 posts views Thread by Bryan R. Meyer | last post: by
4 posts views Thread by Jane Withnolastname | last post: by
14 posts views Thread by Harlan Messinger | last post: by
19 posts views Thread by MasonC | last post: by
6 posts views Thread by rajek | last post: by
11 posts views Thread by NS | last post: by
1 post views Thread by Charles Harrison Caudill | last post: by
18 posts views Thread by Jason Tesser | last post: by
2 posts views Thread by Rob R. Ainscough | last post: by
6 posts views Thread by Mark | last post: by
reply views Thread by leo001 | last post: by
1 post views Thread by ZEDKYRIE | last post: by

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.