Why doesn't this page display correct in IE6?
January 7, 2007 1:46 PM   Subscribe

I have several pages displaying correctly in Firefox but not in IE6.

Hi,

I am working on a new set of pages that start at:
http://localhost/index.cfm?PageType=42.

In Firefox the page shows the 3 columns properly but in IE6 the middle column expands over the width of the page. This only happens when I use a form class f-wrap-1 or f-wrap-2.

As much as I would love to just design for Firefox, 95% of the users are IE only.

Any suggestions would be greatly appreciated.

Michael

The CSS code follows:
/*
LEGAL
=====
Copyright: Daemon Pty Limited 1995-2006, http://www.daemon.com.au & http://www.mollio.org/
License: Released Under the "Common Public License 1.0", http://www.opensource.org/licenses/cpl.php
Version: 010306
*/

/* THE BIG GUYS */
* {margin:0;padding:0}
body {padding: 0 0 20px;background: #fff url("images/body_bg.gif") repeat-x 0 100%;color:#333;font:83%/1.5 arial,tahoma,verdana,sans-serif}

/* LINKS */
a,a:link,a:link,a:link,a:hover {background:transparent;text-decoration:underline;cursor:pointer}
a:link {color:#c00}
a:visited {color:#666}
a:hover,a:active {color:#069}

/* FORMS */
form {margin: 0 0 1.5em}
input {font-family: arial,tahoma,verdana,sans-serif;margin: 2px 0}

fieldset {border: none}
label {display:block;padding: 5px 0}
label br {clear:left}
button.f-submit0 {padding: 1px;background:#666;color:#fff;font-weight:bold;font-size:96%}
/* FORMS - general classes */
input.f-submit {padding: 1px 3px;background:#666;color:#fff;font-weight:bold;font-size:96%}
input.f-submit2 {padding: 1px 3px;background:#666;color:#fff;font-weight:bold;font-size:85%}
input.f-submit0 {padding: 1px;background:#666;color:#fff;font-weight:bold;font-size:96%}

/* FORMS - f-wrap-1 - simple form, headings on left, form elements on right */
form.f-wrap-1 {width:100%;padding: .5em 0;background: #f6f6f6 url("images/featurebox_bg.gif") no-repeat 100% 100%;border-top: 1px solid #d7d7d7;position:relative}
form.f-wrap-1 fieldset {width:auto;margin: 0 1em}
form.f-wrap-1 h3 {margin:0 0 .6em;font: bold 155% arial;color:#c00}
form.f-wrap-1 label {clear:left;float:left;width:100%;border-top: 1px solid #fff}

/* hide from IE mac \*/
form.f-wrap-1 label {float:none}
/* end hiding from IE5 mac */

form.f-wrap-1 label input, form.f-wrap-1 label textarea, form.f-wrap-1 label select {width:15em;float:left;margin-left:10px}

form.f-wrap-1 label b {float:left;width:8em;line-height: 1.7;display:block;position:relative}
form.f-wrap-1 label b .req {color:#c00;font-size:150%;font-weight:normal;position:absolute;top:-.1em;line-height:1;left:-.4em;width:.3em;height:.3em}
form.f-wrap-1 div.req {color:#666;font-size:96%;font-weight:normal;position:absolute;top:.4em;right:.4em;left:auto;width:13em;text-align:right}
form.f-wrap-1 div.req b {color:#c00;font-size:140%}
form.f-wrap-1 label select {width: 15.5em}
form.f-wrap-1 label textarea.f-comments {width: 25em}
form.f-wrap-1 label textarea.f-commentsbig {width: 35em}
form.f-wrap-1 div.f-submit-wrap {padding: 5px 0 5px 8em}
form.f-wrap-1 input.f-submit {margin: 0 0 0 10px}
form.f-wrap-1 input.f-submit0 {width: 5em;margin: 0 0 0 1px}

form.f-wrap-1 fieldset.f-checkbox-wrap, form.f-wrap-1 fieldset.f-radio-wrap {float:left;width:32em;border:none;margin:0;padding-bottom:.7em}
form.f-wrap-1 fieldset.f-checkbox-wrap b, form.f-wrap-1 fieldset.f-radio-wrap b {float:left;width:8em;line-height: 1.7;display:block;position:relative;padding-top:.3em}
form.f-wrap-1 fieldset.f-checkbox-wrap fieldset, form.f-wrap-1 fieldset.f-radio-wrap fieldset {float:left;width:13em;margin: 3px 0 0 10px}
form.f-wrap-1 fieldset.f-checkbox-wrap label, form.f-wrap-1 fieldset.f-radio-wrap label {float:left;width:13em;border:none;margin:0;padding:2px 0;margin-right:-3px}
form.f-wrap-1 label input.f-checkbox, form.f-wrap-1 label input.f-radio {width:auto;float:none;margin:0;padding:0}

form.f-wrap-1 label span.errormsg {position:absolute;top:0;right:-10em;left:auto;display:block;width:16em;background: transparent url(images/errormsg_bg.gif) no-repeat 0 0}
form.f-wrap-1 label span.errormsg b {padding: 10px 0;margin: 0 10px 0 30px;color:#B30800;font-weight:bold;display:block;width:auto;float:none;line-height:1.3}

/* Form type 2 */
form.f-wrap-2 {width:100%;position:relative}
form.f-wrap-2 fieldset {width:auto;margin: 0 1em}
form.f-wrap-2 h3 {margin:0 0 .6em;font: bold 155% arial;color:#c00}
form.f-wrap-2 label {clear:left;float:left;width:100%;border-top: 1px solid #fff}

/* hide from IE mac \*/
form.f-wrap-2 label {float:none}
/* end hiding from IE5 mac */

form.f-wrap-2 label input, form.f-wrap-2 label textarea, form.f-wrap-2 label select {width:15em;float:left;margin-left:10px}

form.f-wrap-2 label b {float:left;width:8em;line-height: 1.7;display:block;position:relative}
form.f-wrap-2 label b .req {color:#c00;font-size:150%;font-weight:normal;position:absolute;top:-.1em;line-height:1;left:-.4em;width:.3em;height:.3em}
form.f-wrap-2 div.req {color:#666;font-size:96%;font-weight:normal;position:absolute;top:.4em;right:.4em;left:auto;width:13em;text-align:right}
form.f-wrap-2 div.req b {color:#c00;font-size:140%}
form.f-wrap-2 label select {width: 15.5em}
form.f-wrap-2 label textarea.f-comments {width: 25em}
form.f-wrap-2 label textarea.f-commentsbig {width: 35em}
form.f-wrap-2 div.f-submit-wrap {padding: 5px 0 5px 8em}
form.f-wrap-2 input.f-submit {margin: 0 0 0 10px}
form.f-wrap-2 input.f-submit0 {width: 5em;margin: 0 0 0 1px}

form.f-wrap-2 fieldset.f-checkbox-wrap, form.f-wrap-1 fieldset.f-radio-wrap {float:left;width:32em;border:none;margin:0;padding-bottom:.7em}
form.f-wrap-2 fieldset.f-checkbox-wrap b, form.f-wrap-1 fieldset.f-radio-wrap b {float:left;width:8em;line-height: 1.7;display:block;position:relative;padding-top:.3em}
form.f-wrap-2 fieldset.f-checkbox-wrap fieldset, form.f-wrap-1 fieldset.f-radio-wrap fieldset {float:left;width:13em;margin: 3px 0 0 10px}
form.f-wrap-2 fieldset.f-checkbox-wrap label, form.f-wrap-1 fieldset.f-radio-wrap label {float:left;width:13em;border:none;margin:0;padding:2px 0;margin-right:-3px}
form.f-wrap-2 label input.f-checkbox, form.f-wrap-1 label input.f-radio {width:auto;float:none;margin:0;padding:0}

form.f-wrap-2 label span.errormsg {position:absolute;top:0;right:-10em;left:auto;display:block;width:16em;background: transparent url(images/errormsg_bg.gif) no-repeat 0 0}
form.f-wrap-2 label span.errormsg b {padding: 10px 0;margin: 0 10px 0 30px;color:#B30800;font-weight:bold;display:block;width:auto;float:none;line-height:1.3}

/* TYPOGRAPHY */
p, ul, ol {margin: 0 0 1.5em}
h1, h2, h3, h4, h5, h6 {letter-spacing: -1px;font-family: arial,verdana,sans-serif;margin: 1.2em 0 .3em;color:#000;border-bottom: 1px solid #eee;padding-bottom: .1em}
h1 {font-size: 196%;margin-top:.6em}
h2 {font-size: 136%}
h3 {font-size: 126%}
h4 {font-size: 116%}
h5 {font-size: 106%}
h6 {font-size: 96%}
.highlight {color:#E17000}
.subdued {color:#999}
.error {color:#c00;font-weight:bold}
.success {color:#390;font-weight:bold}
.caption {color:#999;font-size:11px}
.date {font: bold 82% arial;color:#bbb;display:block;letter-spacing: 1px}
.tute{color:#900;font-size:110%}
small {font-size:11px}

/* LISTS */
ul {margin: .3em 0 1.5em 0;list-style-type:none}
ul.related {margin-top: -1em}
ol {margin: .5em .5em 1.5em}
ol li {margin-left: 1.4em;padding-left: 0;background: none; list-style-type: decimal}
li {line-height: 1.4em;padding-left: 25px;background: transparent url("images/sprites.gif") no-repeat 0 0}
li.doc {background-position: 3px -500px}
ul.nomarker li {background:none;padding-left:0}

dl {margin: 0 0 1em 0}
dt {font-weight:bold;margin-top: 1.3em}
dl dl {margin: 0 0 1.5em 30px}

/* GENERAL */
img {border:none}
hr {margin: 1em 0;background:#f2f2f2;height:1px;color:#f2f2f2;border:none;clear:both}
.clear {clear:both;position:relative;font-size:0px;height:0px;line-height:0px}

/* LAYOUT - HEADER */
#header {background: #666 url("images/sprites.gif") repeat-x 0 100%;margin: 0 0 25px;padding: 0 0 8px}

#header #site-name {font: 265% arial;letter-spacing: -.05em;margin:0 0 0 40px;padding:3px 0;color:#ccc;border:none}

/* NAV - top horizontal nav */
#nav, #nav ul {padding: 0;margin: 0;list-style: none}
#nav {font-weight:bold;height:2.09em;font: bold 96% arial;margin: 0 105px 0 40px}
#nav li {position:relative;background: #999;float: left;width: auto;display:block;margin: 0;border-bottom: 3px solid #666;border-right: 3px solid #252525;padding:0}
#nav a, #nav a:link, #nav a:visited, #nav a:hover, #nav a:active {text-decoration:none;cursor:pointer;color:#fff;display: block;padding: 4px 10px 2px}
#nav a:hover {color:#000}

#nav li ul {border-left: 1px solid #c00;background: #f6f6f6 url("images/featurebox_bg.gif") no-repeat 100% 100%;width:15.8em;font-size:90%;margin-top:3px;position: absolute;font-weight:normal;left: -999em}
#nav li:hover ul, #nav li.sfhover ul {left: 0;z-index:99999}

#nav li li {background:none;float:none;border:none;border: 1px solid #999;border-top:1px solid #fff;border-right:none;border-left:none;padding-left:0}
#nav li li.last {border-bottom:none}
#nav li li a, #nav li li a:link, #nav li li a:visited, #nav li li a:hover {color:#000;padding: 3px 10px 2px;width:14em}
#nav li li a:hover {color:#fff;background:#c00}

#nav li.active {background: #c00;border-bottom: 3px solid #c00}
#nav li.active ul {border:none;background: #c00 url("images/featurebox2_bg.gif") no-repeat 100% 100%}
#nav li.active a:link, #nav li.active a:visited, #nav li.active a:hover, #nav li.active a:active {}
#nav li.active a:hover {color:#000}

#nav li.active li {border:none;border-top: 1px solid #c15c5c;border-bottom: 1px solid #870000}
#nav li.active li.last {border-bottom: none}
#nav li.active li a:link, #nav li.active li a:visited, #nav li.active li a:hover, #nav li.active li a:active {color:#fff}
#nav li.active li a:hover {background: #666 url("images/sprites.gif") repeat-x 0 99%;color:#fff}

#nav li.active li.active a:link, #nav li.active li.active a:visited, #nav li.active li.active a:hover, #nav li.active li.active a:active {color:#fff;font-weight:bold;background: #666 url("images/sprites.gif") repeat-x 0 99%}

/* hide from IE mac \*/
#nav li {width:auto}
/* end hiding from IE5 mac */

/* SEARCH */
#search {color:#fff;font-weight:bold;position:absolute;top:10px;right:110px}
#search form {margin:0}
#search input {width:8em;margin: 0 0 -1px;height:1.2em}
#search label {padding:5px 0 0;display:inline}
#search input.f-submit {width:auto;font-size:81%;margin:0 0 -.15em;height:1.95em}

/* POWERED BY - mollio logo in this case */
#poweredby {width:96px;height:63px;position:absolute;top:-102px;right:0}

/* LAYOUT - main body of page */
#wrap {min-width:770px;max-width:1200px;margin: 0 auto;position:relative}
#content-wrap {position:relative;width:100%}
#utility {position:absolute;top:0;left:25px;width:165px;border-top: 5px solid #999;padding-bottom: 40px}
#sidebar {position:absolute;top:0;right:25px;width:20%;border-top: 5px solid #999;padding-top: 1px;padding-bottom: 40px}

#content {margin: 0 50px}
#content #breadcrumb {margin-top:-5px;font-size:93%;font-weight:bold}
#content #breadcrumb a:link, #content #breadcrumb a:visited {text-decoration:none}
#content #breadcrumb a:hover, #content #breadcrumb a:active {text-decoration:underline}

.featurebox {color:#333;padding: 15px 20px 20px;border-top: 1px solid #d7d7d7;margin: 0 0 1.5em;background: #f6f6f6 url("images/featurebox_bg.gif") no-repeat 100% 100%}
.featurebox p, .featurebox h1, .featurebox h2, .featurebox h3, .featurebox h4, .featurebox h5, .featurebox h6 {margin: 0 0 .3em;border-bottom: 1px solid #c00;color:#c00}
.featurebox p {border:none;margin: 0 0 1em;color:#444}
.featurebox a {font-weight:bold}

.thumbnail {margin: 0 0 0 10px;position:relative;z-index:9999;border: 1px solid #eee;float:right;width:100px;padding:5px;background:#fff}
.thumbnail img {border: 1px solid #000}

.pagination {background: #f2f2f2;color:#666;padding: 4px 2px 4px 7px;border: 1px solid #ddd;margin: 0 0 1.5em}
.pagination p {position:relative;text-align:right}
.pagination p a:link, .pagination p a:visited, .pagination p a:hover, .pagination p a:active {text-decoration:none;background:#fff;padding:2px 5px;border: 1px solid #ccc}
.pagination p a:hover {background:#c00;color:#fff}
.pagination p span {text-decoration:none;background:#fff;padding:2px 5px;border: 1px solid #ccc;color:#ccc}
.pagination * {margin:0}
.pagination h4 {margin-top:-1.45em;padding:0;border:none}

#resultslist-wrap {margin: 0 0 1.5em;font-size:92%}
#resultslist-wrap dt, #resultslist-wrap dl {margin: 0}
#resultslist-wrap dt {font: bold 85% arial;padding: 3px 0}
#resultslist-wrap li {padding: 0 0 1em;margin:0 0 0 1.2em;font: bold 145% arial}
#resultslist-wrap li dd {font: normal 73% arial}
#resultslist-wrap li dl {margin:0}
#resultslist-wrap dd {line-height:1.3}
#resultslist-wrap dd.filetype, #resultslist-wrap dd.date {color:#999;display:inline;padding-right:.5em}

/* TABLES */
.table1 {border: 2px solid #900;border-collapse:collapse;width:100%}
.table1 td {background: #fff url("images/sprites.gif") repeat-x 0 -1600px;padding:3px;border: 1px solid #fff}
.table1 th {text-align:left;border: 1px solid #fff}
.table1 thead th {color:#fff;font-size:145%;background: #900 url("images/sprites.gif") repeat-x 0 -1300px;padding: 10px 6px}
.table1 tbody th {color:#fff;font-size:115%;background: #88b8db url("images/sprites.gif") repeat-x 0 -1400px;padding: 6px}
.table1 tbody th.sub {font-size:100%;color:#000;background: #efefef url("images/sprites.gif") repeat-x 0 -1500px;padding: 6px}
.table1 tr.hideme {visibility:hidden;}
.table1 tr.sizeme {height:0px;}
.table1 td.sizeme {height:0px;}
.table2 {border: 1px solid #900;width:100%}
.table2 td {background: #fff url("images/sprites.gif") repeat-x 0 -1600px;padding:3px;border: 1px solid #fff}
.table2 th {text-align:left;border: 1px solid #fff}
.table2 thead th {color:#fff;font-size:145%;background: #900 url("images/sprites.gif") repeat-x 0 -1300px;padding: 10px 6px}
.table2 tbody th {color:#fff;font-size:115%;background: #88b8db url("images/sprites.gif") repeat-x 0 -1400px;padding: 6px}
.table2 tbody th.sub {font-size:100%;color:#000;background: #efefef url("images/sprites.gif") repeat-x 0 -1500px;padding: 6px}
.table2 tr.hideme {visibility:hidden;}
.table2 tr.sizeme {height:0px;}
.table2 td.sizeme {height:0px;}
.table2 td.jobtitle {font-size:95%;font-stretch:extra-expanded;color:c00;}
.table2 td.smaller {font-size:80%;}
/* TABLES - calendar */
.calendar {width:200px;font-size:92%}
.calendar td {text-align:center;border: 1px solid #ddd}
.calendar th {text-align:center}
.calendar thead th {padding: 3px 2px}
.calendar tbody th {padding: 2px}
.calendar tbody th.sub {padding: 2px}

/* 'MORE' LINK - provides an accessible alternative to just using 'more' as a link at the end of paragraphs */
a.morelink:link, a.morelink:visited, a.morelink:hover, a.morelink:active {background: transparent url("images/sprites.gif") no-repeat 5px -500px;padding-left:21px}
a.morelink:hover {background: transparent url("images/sprites.gif") 5px -400px}
.morelink span {position:absolute;left:-9999px;width:900px}

/* CODE - formatting for code inserted into body - more here: http://dizque.lacalabaza.net/temp/lipt/ */
ol.code {font-family: monospace;position:relative}
ol.code li {color: #666;margin-bottom: 1px}
ol.code code {color: #000;display: block}
ol.code .cmt {color: #4077d2}
li.tab0 code {padding-left: 4em}
li.tab1 code {padding-left: 8em}
li.tab2 code {padding-left: 12em}
li.tab3 code {padding-left: 16em}
li.tab4 code {padding-left: 20em}
li.tab5 code {padding-left: 24em}
ol.code li {background: #f3f3f3 url("images/td_bg.gif") no-repeat 100% 100%}
p.note {margin: 1em;border: 1px solid #ddd;background: #f0f0f0;padding: 1em}

/* LAYOUT TYPE B */
#type-b #content-wrap {background: transparent url("images/content_wrap_bg.gif") repeat-y 30px 0}
#type-b #content {margin: 0 23px 0 235px}

/* LAYOUT TYPE C */
#type-c #content-wrap {background: transparent url("images/content_wrap_bg.gif") repeat-y 30px 0}
#type-c #content {margin: 0 25% 0 235px}

/* LAYOUT TYPE D */
#type-d #content {margin: 0 25% 0 50px}

/* LAYOUT TYPE E */
#type-e #content-wrap {background: transparent url("images/content_wrap_e_bg.gif") repeat-y 100% 0}
#type-e #utility {position:absolute;top:0;left:auto;right:25px;width:165px;border-top: 5px solid #999}
#type-e #content {margin: 0 243px 0 50px}

/* SECONDARY NAVIGATION - vertical navigation */
#nav-secondary, #nav-secondary ul {position:static}
#nav-secondary, #nav-secondary li {list-style: none;margin:0;padding:0;background:#fff}
#nav-secondary {padding-top:0;border-top: 1px solid #ccc;margin-top: 1px}
#nav-secondary a {line-height:1.8;padding: 5px 0 5px 23px;background: #fff url("images/sprites.gif") no-repeat 10px -695px;font: bold 86% arial;display:block}
#nav-secondary a, #nav-secondary a:link, #nav-secondary a:visited, #nav-secondary a:hover, #nav-secondary a:active {text-decoration:none;cursor:pointer}
#nav-secondary a:link {color:#000}
#nav-secondary a:visited {color:#000}
#nav-secondary a:hover {color:#c00;background: #fee url("images/sprites.gif") no-repeat 10px -695px}
#nav-secondary li.active a:link, #nav-secondary li.active a:visited, #nav-secondary li.active a:hover, #nav-secondary li.active a:active {color:#c00}
#nav-secondary li {border-top: 1px solid #fff;border-bottom: 1px solid #ccc}

/* SECONDARY NAVIGATION - 2nd TIER */
#nav-secondary ul {margin: 0 0 1em 23px;padding:0}
#nav-secondary li.active li a, #nav-secondary li.active li a:link, #nav-secondary li.active li a:visited {line-height:1.5;background: #fff url("images/sprites.gif") no-repeat 0 -798px;padding:0 0 0 12px;font-weight:normal;width:auto;color:#000;width:130px;display:block}
#nav-secondary li.active li a:hover, #nav-secondary li.active li a:active {color: #c00}
#nav-secondary li.active li {border: none;margin:0}

#nav-secondary li.active li.active a:link,
#nav-secondary li.active li.active a:visited,
#nav-secondary li.active li.active a:hover,
#nav-secondary li.active li.active a:active {font-weight:bold}

/* SECONDARY NAVIGATION - 3rd TIER */
#nav-secondary ul ul {margin: 0 0 1em 13px;padding:0}
#nav-secondary li.active li.active li a, #nav-secondary li.active li.active li a:link, #nav-secondary li.active li.active li a:visited {width:117px}
#nav-secondary li.active li.active li a:link,
#nav-secondary li.active li.active li a:visited,
#nav-secondary li.active li.active li a:hover,
#nav-secondary li.active li.active li a:active {font-weight:normal}
#nav-secondary li.active li.active li.active a:link,
#nav-secondary li.active li.active li.active a:visited,
#nav-secondary li.active li.active li.active a:hover,
#nav-secondary li.active li.active li.active a:active {font-weight:bold}

/* SECONDARY NAVIGATION - 4th TIER */
#nav-secondary ul ul ul {margin: 0 0 1em 13px;padding:0}
#nav-secondary li.active li.active li.active li a, #nav-secondary li.active li.active li.active li a:link, #nav-secondary li.active li.active li.active li a:visited {width:104px}
#nav-secondary li.active li.active li.active li a:link,
#nav-secondary li.active li.active li.active li a:visited,
#nav-secondary li.active li.active li.active li a:hover,
#nav-secondary li.active li.active li.active li a:active {font-weight:normal}
#nav-secondary li.active li.active li.active li.active a:link,
#nav-secondary li.active li.active li.active li.active a:visited,
#nav-secondary li.active li.active li.active li.active a:hover,
#nav-secondary li.active li.active li.active li.active a:active {font-weight:bold}

/* LAYOUT - FOOTER */
#footer {clear:both;border-top: 1px solid #E3E8EE;padding: 10px 0 30px;font-size:86%;color:#999}
#footer p {margin:0}
#footer a:link {color:#999}
/* Images */
.floatright
{
float: right;
margin: 0 0 10px 10px;
border: 1px solid #666;
padding: 2px;
}
.floatleft
{
float: left;
margin: 0 0 10px 10px;
border: 1px solid #666;
padding: 2px;
}
posted by mickbw to Computers & Internet (7 answers total)
 
Your URL isn't publicly accessible, if you meant for people to try to load your pages.
posted by Steven C. Den Beste at 1:52 PM on January 7, 2007


IE will misinterpret padding and add it to the width of an element, and misinterpret a milllion other things. I would guess that mollio templates that you used are crossbrowser compatible, so undo each of your changes until it's fixed, and then figure out what's going wrong.
posted by tmcw at 2:02 PM on January 7, 2007


Well, without seeing your page in my browser, it's kind of hard to troubleshoot. I have a feeling that your margins/padding on those containers might be causing the problem.

First off - are you using a strict doctype?

1). If not, you're probably triggering quirks mode in IE and are getting a the IE 5 box model, which calculates the size of containers differently than Firefox most of the other standards compliant browsers out there.

More box model details.
posted by hobbes8calvin at 2:11 PM on January 7, 2007


Just noting that you haven't validated it -- there's only one error found by the validator, which is probably not the one causing the problem, but still.
posted by AmbroseChapel at 2:24 PM on January 7, 2007


hard to know for sure, but definitely looks like in this:

form.f-wrap-2 {width:100%;position:relative}


the 100% width is stretching the page. 100% widths will behave very differently in different browsers. try setting an absolute width in pixels for the columns that are currently being squeezed down.

Or, unless you really need something to stretch really wide to fill the whole browser, just dont use 100% widths at all. Specifying pixels is always safer.
posted by drjimmy11 at 3:10 PM on January 7, 2007


Yeah, but it sucks really bad for people who use wide screens and big fonts.
posted by Malor at 3:38 PM on January 7, 2007


Response by poster: I am sorry to be such an idiot.

I was trying to make the changes locally and copied the wrong URI.

The page is located at :
http://jobsearchlog.com/index.cfm?PageType=42

I did try setting a pixel value of 500px for the f-wrap-2 width as a test and it didn't make a difference.

I will try making the changes in the doctype and see if I can get it to work as well as validating the html.

Thanks for all the help and suggestions.

Michael
posted by mickbw at 7:48 PM on January 7, 2007


« Older MP3 Files to Old School AM Radio?   |   Volunteering in Ecuador/Galapagos Newer »
This thread is closed to new comments.