8
I seem to be having a problem with my CSS in IE 7. The problem does not show up in FireFox though.
I've setup an online store that originally had a #wrapper "container" and #body CSS tags with widths of 1000 pixels. I know that their are many internet users that still have low resolutions such as 800 pixels. So I set out to change the width of the storefront to around 780 pixels.
I've changed the width for the #wrapper and #body tags in the CSS, but for some reason the width will not change in IE 7. IE 7 still looks as though it is keeping the original 1000 pixel width. Please take a look: THE WEBSITE .
There are three columns in a table within the #wrapper and #body of the index page. I have found if I change the middle column to the smallest width possible, the column and content will decrease in size, but the overall page will still keep the 1000 pixel width. On the other hand, if I take out the middle column, all together, THEN (and only THEN) IE 7 will decrease the width to the 780 pixels.
I have also tried clearing out the cache in both of my browsers to make sure that it wasn't re-using past browser info, but it has no effect.
Any and all help will be extremely appreciated.
THIS IS THE RELEVANT CSS FOR THE PAGE I AM WORKING ON:
Expand|Select|Wrap|Line Numbers
- body {
- font-size: 90%;
- color: #161a20;
- width: 780px; /*set the site width - not below 750*/
- text-align: center; /* For IE*/
- margin: 0 auto; /*For Mozilla & Opera*/
- }
- .wrapper {
- width: 780px;
- }
- .header {
- background-image:url(img/header_middle.gif);
- background-repeat:repeat-x;
- color:white;
- height:76px;
- width:780px;
- overflow:hidden;
- }
- .subTitleBar {
- background-color:white;
- }
- #search_bar {
- margin-top:2px;
- background-color:#FFF;
- height:26px;
- text-align:center;
- margin-bottom:10px;
- }
- #search_bar_right {
- float:none;
- text-align:right;
- background-image:url(img/search_bar_right.gif);
- background-position:center;
- background-repeat:no-repeat;
- width:100%;
- overflow:hidden;
- height:26px;
- }
- .center_column {
- padding-left:15px;
- padding-right:15px;
- }
- .center_column * {
- font-size:14px;
- }
[HTML]<body>
<table class="wrapper" border="0" cellspacing="0" cellpadding="0">
<tr valign="top">
<td height="1%" colspan="3" >
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" class="header">
<tr>
<td colspan="3" width="100%" class="subTitleBar">
<div id="search_bar" align="center">
<div id="search_bar_right">
<?php
includes_start("modules/search/search_nug.php");
require(basename("modules/search/search_nug.php"));
includes_end();
?>
</div>
</div>
</td>
</tr>
</table>
</td>
</tr>
<td width="1%" height="98%" valign="top">
<?php
includes_start("modules/category/cat_nug.php");
require(basename("modules/category/cat_nug.php"));
includes_end();
?>
<?php
includes_start("modules/manufacturers/man_nug.php");
require(basename("modules/manufacturers/man_nug.php"));
includes_end();
?>
<?php
includes_start("modules/offers/offer_nug.php");
require(basename("modules/offers/offer_nug.php"));
includes_end();
?> </td>
<td height="98%" valign="top" class="center_column"><?php
$incFileName = $mxiObj->getCurrentInclude();
if ($incFileName !== null) {
includes_start($incFileName);
require(basename($incFileName)); // require the page content
includes_end();
}
?></td>
<td width="1%" height="98%" align="right" valign="top">
<?php if (!preg_match) {?>
<?php
includes_start("modules/cart/cart_nug.php");
require(basename("modules/cart/cart_nug.php"));
ncludes_end();
?> <br>
<?php } // Show if dynamic field equalto
?>
<?php } ?>
<?php
// Show IF Conditional region2
if (!preg_match("['mod'])) {
?>
<?php
includes_start("modules/users/login_nug.php");
require(basename("modules/users/login_nug.php"));
includes_end();
?>
<br/>
<?php }
// endif Conditional region2
?>
<?php
//Show If User Is Logged In (region1)
$isLoggedIn = new UserLoggedIn($conn);
if ($isLoggedIn->Execute()) {
?>
<?php
includes_start("modules/orders/history_nug.php");
require(basename("modules/orders/history_nug.php"));
includes_end();
?>
<?php
}
//End Show If User Is Logged In (region1)
?></td>
<tr bgcolor="#CCCCCC">
<td colspan="3" height="1%" class="footer">
<div class="footer_left_links">Copyright 2007</div>
<div class="footer_right_text">Powered by </div> </td>
</tr>
</table>
</body>
</html>
<?php
mysql_free_result($1);
mysql_free_result($2);
?>[/HTML]
