Hello Folks,
Been trying to widen my site's body from "779" to "1000" so it almost fills the window. IE 7 on windows XP just dismantles the pages and leaves wide gaps between the left column and the body with no change in size to the body width. FF is doing it right. Please let me know if this problem can be fixed, I am at my wit's end. I will also send more code if needs be.
I have lots of other code but I will copy and paste the one I think will help clarify my question. Any help will be greatly appreciated. Screen shots will especially be welcome as they will reduce misunderstanding greatly.
Here goes:
HTML:
<?xml version="1.0" encoding="{lang mkey='ENCODING'}"?>
<!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">
{strip}
<head>
{if $title != '' }
<title>{$title} </title>
{elseif $config.site_title ne '' }
<title>{$config.site_title|stripslashes}</title>
{else}
<title>{lang mkey='title'}</title>
{/if}
<meta http-equiv="Content-Type" content="text/html; charset={lang mkey='ENCODING'}" />
<meta name="keywords" content="{$config.meta_keywords}" />
<meta name="description" content="{$config.meta_description}" />
<script type="text/javascript">
/* <![CDATA[ */
var loadingTag = "{lang mkey='loading'}";
var modeRewrite = "{$config.enable_mod_rewrite}";
var docRoot = "{$smarty.const.DOC_ROOT}";
var alphanumeric_chars = "{lang mkey='alphanumeric'}";
var alphanum_chars = "{lang mkey='alphanum'}";
var text_chars = "{lang mkey='text'}";
var full_chars = "{lang mkey='full_chars'}";
{if $config.use_popups == 'N'}
var use_popups = false;
{else}
var use_popups = true;
{/if}
{if $config.use_profilepopups == 'N'}
var use_profilepopups = false;
{else}
var use_profilepopups = true;
{/if}
/* ]]> */
</script>
<link href="{$css_path}default.css" rel="stylesheet" type="text/css" />
{$addtional_css}
<script type="text/javascript" src="{$DOC_ROOT}javascript/functions.js"></script>
<script type="text/javascript" src="{$DOC_ROOT}javascript/check.js"></script>
<script type="text/javascript" src="{$DOC_ROOT}javascript/validate.js"></script>
<script type="text/javascript" src="{$DOC_ROOT}javascript/editor.js"></script>
{if $config.enable_shoutbox == 'Y' or $config.enable_shoutbox == '1'}
<script type="text/javascript" src="{$DOC_ROOT}javascript/shoutbox.js"></script>
{/if}
{$addtional_javascript}
<script type="text/javascript">
/* <![CDATA[ */
function insufficientPrivileges(){ldelim}
alert("{lang mkey='insufficientPrivileges'}");
return false;
{rdelim}
function newvalidateLogin(newform)
{ldelim}
if (newform.txtusername.value == '') {ldelim}
alert("{lang mkey='signup_js_errors' skey='username_noblank'}");
return false;
{rdelim}
if (newform.txtpassword.value == '') {ldelim}
alert("{lang mkey='signup_js_errors' skey='password_noblank'}");
return false;
{rdelim}
{rdelim}
/* ]]> */
</script>
</head>
<body dir="{lang mkey='DIRECTION'}" {if $google_map eq 'Y'}onload="load_map()"{/if}>
<center>
<!-- Header portion -->
<table class="main_outer_table" cellpadding="0" cellspacing="0" width="1000" border="0" > //*from 779 to 1000-worked ok-black area.
<tr>
<td width="100%">
<table width="1000" border="0" cellpadding="0" cellspacing="0" class="headbg">
<tr>
{ if $config.site_logo != ''}
<td width="544" valign="bottom">
<img src="{$config.site_logo}" alt="" />
</td>
{else}
<td width="244" valign="bottom" >
<a href="index.php" class="main_title">{$config.site_name|stripslashes }</a>
</td>
<td width="300" valign="bottom" align="center">
<table width="191" border="0" cellpadding="0" cellspacing="0" >/* this is the beginning of couple pic in header */
<tr>
<td width="64" height="52">
<img src="{$image_dir}pic_09.jpg" {*width="64" height="52"*} alt="" /></td>
<td width="63" height="52">
<img src="{$image_dir}pic_10.jpg" {*width="63" height="52"*} alt="" /></td>
<td width="64" height="52">
<img src="{$image_dir}pic_11.jpg" {*width="64" height="52"*} alt="" /></td>
</tr>
<tr>
<td height="52" width="64">
<img src="{$image_dir}pic_13.jpg" {*width="64" height="52"*} alt="" /></td>
<td height="52" width="63">
<img src="{$image_dir}pic_14.jpg" {*width="63" height="52"*} alt="" /></td>
<td height="52" width="64">
<img src="{$image_dir}pic_15.jpg" {*width="64" height="52"*} alt="" /></td>
</tr>
<tr>
<td height="52" width="64">
<img src="{$image_dir}pic_16.jpg" {*width="64" height="52"*} alt="" /></td>
<td height="52" width="63">
<img src="{$image_dir}pic_17.jpg" {*width="63" height="52"*} alt="" /></td>
<td height="52" width="64">
<img src="{$image_dir}pic_18.jpg" {*width="64" height="52"*} alt="" /></td>
</tr>
</table> /*end of couples pic*/
</td>
{/if}
<td width="235" valign="bottom">
<table width="235" border="0" cellpadding="0" cellspacing="0" >/*Registration Box*/
<tr>
<td height="21" width="17">
<img src="{$image_dir}box_02.jpg" {*width="17" height="21"*} alt="" /></td>
<td height="21" width="202">
<img src="{$image_dir}box_03.jpg" {*width="202" height="21"*} alt="" /></td>
<td height="21" width="16">
<img src="{$image_dir}box_04.jpg" {*width="16" height="21"*} alt="" /></td>
</tr>
<tr>
<td style="background-image: url({$image_dir}box_05.jpg)"></td>
<td align="center" class="headbgbox">
{include file="searchprofile.tpl"}
</td>
<td style="background-image: url({$image_dir}box_07.jpg)"></td>
</tr>
<tr>
<td height="28" width="17">
<img src="{$image_dir}box_19.jpg" {*width="17" height="28"*} alt="" /></td>
<td height="28" width="202">
<img src="{$image_dir}box_20.jpg" {*width="202" height="28"*} alt="" /></td>
<td height="28" width="16">
<img src="{$image_dir}box_21.jpg" {*width="16" height="28"*} alt="" /></td>
</tr>
</table>
</td>
</tr>
</table>
<table width="1000" border="0" cellpadding="0" cellspacing="0" class="loginbarbg">/*begin-from 779 to 1000-worked ok login bar*/
<tr>
<td height="33" width="154"><img src="{$image_dir}top_blue.jpg" alt="" /></td>
<td height="33" width="575">
{if $smarty.session.UserId == ''}
<form name="frmLogin" method="post" action="midlogin.php" onsubmit="javascript: return newvalidateLogin(this);" >
<table width="100%" cellpadding="{$config.cellpadding}" cellspacing="{$config.cellspacing}" border="0">
<tr>
<td height="10">
<b>{lang mkey='members_login'}</b>
<img src="{$image_dir}blue_box.gif" alt="" />
{lang mkey='signup_username'}
<input class="input" maxlength="25" name="txtusername" size="8" style='font-size:9pt;width:70px' />
{lang mkey='signup_password'}
<input class="input" type="password" name="txtpassword" size="8" style='font-size:9pt;width:70px' />
<input type="submit" value="{lang mkey='login_submit'}" class='formbutton' />
<a href='signup.php'>{lang mkey='register'}</a>
</td>
</tr>
</table>
</form>
{else}
<strong>{lang mkey='welcome'}, {$smarty.session.FullName|st ripslashes} ({$smarty.session.UserName})</strong>
{/if}
</td>
<td height="33" width="40" align="right" valign="middle">{if $smarty.session.security.extsearch == 1 and $smarty.session.expired != '1' and ( $smarty.session.status == $lang.status_enum.active or $smarty.session.status == 'Active') }
<a href="advsearch.php?search_new=1"><img src="{$image_dir}search_icon.gif" border="0" width="18" height="18" alt="" /></a>
{/if}
<a href="index.php"><img src="{$image_dir}homepage_icon.gif" border="0" width="18" height="18" alt="" /></a>
</td>
<td height="33" width="10"></td>
</tr>
</table>/*end login bar from 779 to 1000-worked ok*/
<table width="1000" border="0" cellpadding="{$config.cellpadding}" cellspacing="{$config.cellspacing}" bgcolor="#FFFFFF">/*content section with pics*/
<tr>
<!-- Leftside Menu-->
<td width="178" valign="top">
/*News start, Site Statistics {include file="leftcolumn.tpl"} minus "success stories"*/
</td>
<!-- Rendered page -->/*whole of body content*/
<td width="601" valign="top">
{$rendered_page}
<br />
{$modosdate_main}
<br />
</td>
</tr>
</table>
<!-- Footer -->
<table cellpadding="{$config.cellpadding}" cellspacing="{$config.cellspacing}" width="1000" border="0">/*footer start from 779 to 1000-worked ok*/
<tr>
<td width='100%' align='center' class="footer" height="25">
{if $smarty.session.UserId <= 0}
<a href='index.php?page=login' class='footerlink'>{lang mkey='site_links' skey='login'}</a> |
{/if}
{if $config.enable_mod_rewrite == 'Y'}
<a href='privacy.html' class='footerlink'>{lang mkey='site_links' skey='privacy'}</a> |
<a href='terms_of_use.html' class='footerlink'>{lang mkey='site_links' skey='terms_of_use'}</a> |
<a href='services.html' class='footerlink'>{lang mkey='site_links' skey='services'}</a> |
<a href='faq.html' class='footerlink'>{lang mkey='site_links' skey='faq'}</a> |
<a href='articles.html' class='footerlink'>{lang mkey='site_links' skey='articles'}</a> |
{else}
<a href='index.php?page=privacy' class='footerlink'>{lang mkey='site_links' skey='privacy'}</a> |
<a href='index.php?page=terms_of_use' class='footerlink'>{lang mkey='site_links' skey='terms_of_use'}</a> |
<a href='index.php?page=services' class='footerlink'>{lang mkey='site_links' skey='services'}</a> |
<a href='index.php?page=faq' class='footerlink'>{lang mkey='site_links' skey='faq'}</a> |
<a href='index.php?page=articles' class='footerlink'>{lang mkey='site_links' skey='articles'}</a> |
{/if}
<a href='affindex.php' class='footerlink'>{lang mkey='site_links' skey='affliates'}</a> |
{* <a href='javascript:launchTellFriend();' class='footerlink'>{lang mkey='site_links' skey='invite_a_friend'}</a> *}
<a href='tellafriend.php' class='footerlink'>{lang mkey='site_links' skey='invite_a_friend'}</a>
{* Feedback link depending on the option in global site settings *}
{if ( $config.feedback_info == 'Y' && $smarty.session.UserId != '') or $config.feedback_info == 'N'}
|
<a href='feedback.php' class='footerlink'>{lang mkey='site_links' skey='feedback'}</a>
{/if}
</td>
</tr>
<tr><td width='100%' align='center' height="3"></td></tr>
<tr>
<td width='100%' align='center'>
<a href="http://www.tufat.com/osdate.php" class='copyright' target="_blank">{$config.copyright}</a>
</td>
</tr>
<tr><td width='100%' align='center' ></td></tr>
</table>
</td>
</tr>
</table>
</center>
{closedb}
</body>
</html>
{/strip}
CSS:
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #434548;
background-color: #000000;
padding: 0;
margin: 0;
}
form {
padding: 0;
margin: 0;
}
td {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #434548;
}
/* hides text-align to the left from IE, because the next 2 rules doesn't apply to IE */
html>body td {
text-align: left;
}
html>body td[align="center"] {
text-align: center;
}
html>body td[align=center] {
text-align: center;
}
html>body td[align=right] {
text-align: right;
}
html>body td[align="right"] {
text-align: right;
}
*[align="center"] {
text-align: center;
}
*[align=center] {
text-align: center;
}
*[align="right"] {
text-align: right;
}
*[align=right] {
text-align: right;
}
.headbg{
background-color: #FFA500;
}
.headbgbox{
background-color: #FF0000;
}
.loginbarbg{
background-color: #EDF4F9;
}
.module_head, .module_head:hover {
background-color: #FFA500;
font-size: 11px;
font-weight: bold;
color: #FFFFFF;
}
.oddrow, .addrow {
background-color: #FEFEFE;
}
.evenrow {
background-color: #EFEFEF;
}
.module_head_right {
background-color: #4278D3;
font-size: 11px;
color: #FFFFFF;
}
.module_head_right a {
background-color: #4278D3;
font-size: 11px;
color: #FFFFFF;
}
.calendar_module_detail {
font-size: 11px;
font-weight: normal;
background-color: #FCFDFF;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #e8d1cd;
border-right-color: #e8d1cd;
border-bottom-color: #e8d1cd;
border-left-color:#e8d1cd;
color: #121010;
}
.calendar_module_head {
background-color: #4278D3;
font-size: 11px;
font-weight: bold;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #e8d1cd;
border-right-color: #e8d1cd;
border-bottom-color: #e8d1cd;
border-left-color:#e8d1cd;
color: #FFFFFF;
}
.module_head_right a:hover {
background-color: #000000;
font-size: 11px;
color: #FFFFFF;
}
TD.edituserlink{
background-color: #4278D3;
color: #FFFFFF;
font-weight: bold;
}
TD.edituserlink a{
background-color: #4278D3;
color: #FFFFFF;
font-weight: normal;
}
TD.edituserlink A:hover{
background-color: #4278D3;
color: #FFFFFF;
font-weight: normal;
}
.text_head1, .text_head1:hover {
font-size: 14px;
font-weight: bold;
color: #FFFFFF;
}
.text_head2, .text_head2:hover {
font-size: 14px;
font-weight: bold;
color: #0000AF;
}
.offer_head {
font-size: 16pt;
color: #4278D3;
}
.module_detail_inside {
font-size: 11px;
font-weight: normal;
background-color: #F8FBFF;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: none;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #D4E1F6;
border-right-color: #D4E1F6;
border-bottom-color: #D4E1F6;
border-left-color: #D4E1F6;
}
.tos {
font-size: 11px;
font-weight: normal;
background-color: #F8FBFF;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #D4E1F6;
border-right-color: #D4E1F6;
border-bottom-color: #D4E1F6;
border-left-color: #D4E1F6;
margin: 10px;
}
.im_text {
font-size: 11px;
font-weight: normal;
background-color: #F8FBFF;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #95B5E6;
border-right-color: #95B5E6;
border-bottom-color: #95B5E6;
border-left-color: #95B5E6;
}
.module_detail {
font-size: 11px;
font-weight: normal;
background-color: #F8FBFF;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: none;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #D4E1F6;
border-right-color: #D4E1F6;
border-bottom-color: #D4E1F6;
border-left-color: #D4E1F6;
}
.leftside_detail {
font-size: 11px;
font-weight: normal;
background-color: #F8FBFF;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: none;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #D4E1F6;
border-right-color: #D4E1F6;
border-bottom-color: #D4E1F6;
border-left-color: #D4E1F6;
}
.statusbar {
background-color: #D4E1F6;
}
th {
font-weight: bold;
color: #4278D3;
background-color: #D4E1F6;
font-size: 11px;
}
th a {
text-decoration: underline;
color: #4278D3;
}
th a:hover {
color: #4278D3;
text-decoration: none;
}
a.subhead {
text-decoration: underline;
color: #FFFFFF;
font-weight: bold;
}
a.subhead:hover {
color: #FFFFFF;
text-decoration: none;
font-weight: bold;
}
.smallpic {
border: 1px solid #666666;
}
input {
font-size: 11px;
}
textarea {
font-size: 11px;
}
select {
font-size: 11px;
}
.formbutton {
font-size: 11px;
color: #003399;
border-top: 1px solid #CCCCCC;
border-right: 1px solid #666666;
border-bottom: 1px solid #666666;
border-left: 1px solid #CCCCCC;
background-color: #D4E1F6;
}
.main_outer_table{
background-color: #FFFFFF;
}
a.main_title{
font-size: 40px;
color: #FFFFFF;
text-decoration:none;
}
a:hover.main_title{
font-size: 40px;
color: #FFFFFF;
text-decoration:none;
}
.dotted{
border-bottom-width: 1px;
border-bottom-style: dashed;
}
.s_table_blue{
color: #27277E;
font-weight: bold;
}
.s_table_white{
color: #27277E;
}
.table_blue{
background-color: #D3E1FA;
color: #27277E;
}
.table_white{
background-color: #FFFFFF;
color: #27277E;
}
.table_green{
background-color: #D8F9D5;
color: #003300;
}
.table_red{
background-color: #FFD5D5;
color: #990000;
}
.table_pink{
background-color: #FFE1FF;
color: #7D0067;
}
.table_gray{
background-color: #EFEFEF;
color: #333333;
}
.table_yellow{
background-color: #FFFFCC;
color: #B08D00;
}
.main_text1{
font-size: 24px;
}
.page_heading {
font-size: 14pt;
border: 1px solid #A9BDF1;
background-color: #DADADA;
text-align: center;
}
.headrow {
border: 1px solid #A9BDF1;
background-color: #C8E0FB;
text-align: center;
}
.text8pt {
font-size: 8pt;
}
.searchtitle {
font-size: 14pt;
font-weight: bold;
color: #003366;
}
.xtitle {
font-size: 14pt;
border: 1px solid #A9BDF1;
background-color: #DADADA;
text-align: center;
}
.title {
font-size: 12pt;
border: 1px solid #A9BDF1;
background-color: #DADADA;
text-align: left;
font-weight: bold;
padding: 4px 4px 4px 11px;
margin-left: 11px;
}
.subtitle {
font-size: 10pt;
color: #003366;
border: 1px solid #96B0F5;
background-color: #D7E1EE;
font-weight: bold;
padding: 1px;
}
a {
color: #4278D3;
text-decoration: none;
}
a:hover {
text-decoration: underline;
color: #4278D3;
}
a.menulink {
font-size: 11px;
color: #4278D3;
text-decoration: none;
}
a.menulink:hover {
font-size: 11px;
color: #4278D3;
text-decoration: none;
}
.panellinkhdr {
background-color: #4278D3;
font-size: 11px;
font-weight: bold;
color: #FFFFFF;
}
a.panellink {
font-size: 11px;
font-weight: bold;
text-decoration: none;
color: #4278D3;
}
a.panellink:hover {
font-weight: bold;
font-size: 11px;
text-decoration: underline;
}
.panelbox {
}
.footer {
background-color: #E1EFFB;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: solid;
border-right-style: none;
border-bottom-style: solid;
border-left-style: none;
border-top-color: #95B5E6;
border-right-color: #95B5E6;
border-bottom-color: #95B5E6;
border-left-color: #95B5E6;
}
a.footerlink {
font-size: 8pt;
color: #4278D3;
text-decoration: none;
}
a.footerlink:hover {
font-size: 8pt;
color: #4278D3;
text-decoration: none;
}
.copyright{
color: #AAAAAA;
font-size: 11px;
text-decoration: none;
}
.paneltable{
background-color: #003366;
}
.modulehead{
color: #003366;
}
.storyhead{
color: #4278D3;
font-weight: bold;
}
.storydate{
font-size: 9px;
color: #003366;
font-style: italic;
}
.storyby{
color: #003366;
}
.storytext{
}
.newshead{
color: #4278D3;
font-weight: bold;
}
.newsdate{
font-size: 9px;
font-style: italic;
}
.newstext{
}
.pollquestion{
color: #4278D3;
font-weight: bold;
}
.polloptions{
}
.payment_mod_head{
font-size: 11px;
color: #FFFFFF;
background-color: #3399CC;
}
.admin_head{
font-size: 12px;
color: #4278D3;
font-weight: bold;
}
h4{
font-size: 12px;
}
.copyright:hover {
color: #0000ff;
font-size: 11px;
text-decoration: underline;
}
.errors {
color: red;
}
.headerfooter, .headerfooter:hover { /*** style of "xxx's Profile", "Last logge" ***/
color: #FFFFFF;
font-size: 12px;
font-weight: bold;
height: 20px;
}
.headerfooter:hover { /*** hover: style of "xxx's Profile", "Last logge" ***/
color: #FFFFFF;
text-decoration: none;
}
.nickwidth { /*** width of sections ***/
margin: 10px;
text-align: center;
}
.im_msg {
font-size: 8pt;
}
.menu_subhead {
background-color: #83ADDF;
font-size: 11px;
font-weight: bold;
color: #FFFFFF;
}
.picgallery {
background-color: #F8FBFF;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
Thanks a lot,
Sol.