Using fixed width on my site I have few problems with it working, however I am trying to go with a more variable width format, and it is causing me all sorts of problems in firefox. My main content is overwriting the right menu when it should be resizing to fit in the space.

I can post the CSS if you want, but it is tied into IPB so it will be quite long.


http://www.necrotania.com

Any help would be appreciated.

Thanks

Here is the CSS.

html { overflow-x: auto }
body { scrollbar-base-color: #CED0DA; scrollbar-arrow-color: #706045; font-family: Verdana; font-size: 12px; background-color: #9F9BA1; }
a:link { color: #566362 }
a:active { color: #DCE8FF }
a:visited { color: #625662 }
a:hover { color: #817EAF }
#main {  background: #DFDCDF; text-align: left; width: 96%; }
#main #menu { border-left: 1px solid #000; border-bottom: 1px solid #000;  width: 160px; background: #CED0DA; margin: 0px 0px 0px 0px; padding: 5px; }
#menu   p { font-size: 10px }
.menuborder {
		background:#CED0DA;
		color:#332e27;
		background-image: url(/images/bar-G.gif);
                                font-size:11;
	                width:100%;
                                vertical-align: middle;
                                padding: 4px 0px 4px 0px;
                              

		}
.newsborder {
		background:#CED0DA;
		color:#332e27;
		background-image: url(/images/bar-G.gif);
                                font-size:11;
	                width:100%;
                                vertical-align: middle;
                                padding: 4px 0px 4px 0px;

		}
.newsdiv { text-align: left;border: 1px solid #7E7EAF; width:100%; margin: 5px 5px 5px 5px; padding: 2px;background-color:#CED0DA;z-index:1;}
.logo {
border:0px;
background:#DFDCDF;
width:100%;
}
.divide { background: #7E7EAF; height: 1px; font-size: 1px; width: 100% }
TABLE, TR, TD { font-family: Verdana, Tahoma, Arial, sans-serif;  color: #000;font-size: 11px; background-color:#CED0DA; }
.mainfix
{
background-color:#DFDCDF;
}
/* Start new logo and menu code */
.logonew
{
background-image:url('/images/logot.gif');
background-repeat: no-repeat;
background-position: center center;
width:100%%px;
height:81px;
background-color:#6C89B0;
text-align:center;
}

.menu_new
{
width:760px;
height:19px;
position:relative;
top:81px;
}

.logo_table
{
}
.logo_item
{
width:93px;
height:19px;
background-image:url('/images/blank.gif');
text-align:center;
font-size: 14px;
font-weight: 500;
font-family:Times New Roman;
}

a.logo_bar:link
{
vertical-align: middle;
text-decoration: none;
font-size: 14px;
color:#cccccc;
}

a.logo_bar:visited
{
vertical-align: middle;
text-decoration: none;
color:#cccccc;
}

a.logo_bar:hover
{
vertical-align: middle;
text-decoration: none;
color:#cccccc;
}

a.logo_bar:active
{
vertical-align: middle;
text-decoration: none;
color:#cccccc;
}


.info_box
{
font-size:18;
width:300px;
text-align:right;
}

.news_title
{
text-align:center;
width:400px;
text-weight:600;
}



.right_menu
{
position: relative;
top: 30px;
left: 2px;
float:right;
z-index:1;
width:160px;
height:900px;
margin: 0px 0px 5px 5px;
}

.right_menu_item
{
text-align: left;
margin-top: 5px;
margin-bottom: 5px;
width:160px;
border:1px solid;
background: #CED0DA;
}
/* end new logo and menu code */

#ipbwrapper { text-align: left; width: 95%; margin-left: auto; margin-right: auto }
fieldset.search { padding: 6px; line-height: 150% }
label { cursor: pointer }
form { display: inline }
img { vertical-align: middle; border: 0px }
img.attach { padding: 2px; border: 2px outset #EEF2F7 }
.googleroot { padding: 6px; line-height: 130% }
.googlechild { padding: 6px; margin-left: 30px; line-height: 130% }
.googlebottom, .googlebottom a:link, .googlebottom a:visited, .googlebottom a:active { font-size: 11px; color: #3A4F6C }
.googlish, .googlish a:link, .googlish a:visited, .googlish a:active { font-size: 12px; font-weight: bold; color: #00D }
.googlepagelinks { font-size: 1.1em; letter-spacing: 1px }
.googlesmall, .googlesmall a:link, .googlesmall a:active, .googlesmall a:visited { font-size: 10px; color: #434951 }
li.helprow { padding: 0px; margin: 0px 0px 10px 0px }
ul#help { padding: 0px 0px 0px 15px }
option.cat { font-weight: bold }
option.sub { font-weight: bold; color: #555 }
.caldate { text-align: right; font-weight: bold; font-size: 11px; padding: 4px; margin: 0px; color: #777; background-color: #B5C2DB }
.warngood { color: green }
.warnbad { color: red }
#padandcenter { margin-left: auto; margin-right: auto; text-align: center; padding: 14px 0px 14px 0px }
#profilename { font-size: 12px; font-weight: bold }
#calendarname { font-size: 12px; font-weight: bold }
#photowrap { padding: 6px }
#phototitle { font-size: 12px; border-bottom: 1px solid black }
#photoimg { text-align: center; margin-top: 15px }
#ucpmenu { line-height: 150%; width: 22%; background-color: #CED0DA; border: 1px solid #3C362C; font-size:9px; }
#ucpmenu p { padding: 2px 5px 6px 9px; margin: 0px; background-color:#E0E1E4; }
#ucpcontent { line-height: 150%; width: 570px; background-color: #E0E1E4; border: 1px solid #3C362C }
#ucpcontent p { padding: 10px; margin: 0px }
#ipsbanner { position: absolute; top: 1px; right: 5% }
#logostrip { padding: 0px; margin: 0px; background-color: #3860BB; border: 1px solid #3C362C; background-image: url(style_images/<#IMG_DIR#>/tile_back.gif) }
#submenu { font-size: 10px; margin: 3px 0px 3px 0px; font-weight: bold; color: #3A4F6C; background-color: #DFE6EF; border: 1px solid #3C362C }
#submenu a:link, #submenu  a:visited, #submenu a:active { font-weight: bold; font-size: 10px; text-decoration: none; color: #3A4F6C }
#userlinks { background-color: #F0F5FA; border: 1px solid #3C362C }
#navstrip { font-weight: bold; padding: 6px 0px 6px 0px }
.activeuserstrip { padding: 6px; background-color: #CED0DA }
.pformstrip { font-weight: bold; padding: 7px; margin-top: 1px; color: #000000; background-color: #CED0DA }
.pformleft { padding: 6px; margin-top: 1px; width: 25%; border-top: 1px solid #3C362C; border-right: 1px solid #3C362C; background-color: #CED0DA }
.pformleftw { padding: 6px; margin-top: 1px; width: 40%; border-top: 1px solid #3C362C; border-right: 1px solid #3C362C; background-color: #CED0DA }
.pformright { padding: 6px; margin-top: 1px; border-top: 1px solid #3C362C; background-color: #CED0DA }
.signature { font-size: 10px; line-height: 150%; color: #339 }
.postdetails { font-size: 10px }
.postcolor { font-size: 10px; line-height: 160% }
.normalname { font-size: 12px; font-weight: bold; color: #003 }
.normalname a:link, .normalname a:visited, .normalname a:active { font-size: 12px }
.unreg { font-size: 11px; font-weight: bold; color: #900 }
.post1 { background-color: #CED0DA }
.post2 { background-color: #C5C8D9 }
.postlinksbar { padding: 7px; margin-top: 1px; font-size: 10px; background-color: #CED0DA }
.row1 { background-color: #CED0DA }
.row2 { background-color: #E1E4EB }
.row3 { background-color: #E1E4EB }
.row4 { background-color: #E1E4EB }
.darkrow1 { color: #4F4941; background-color: #E1E4EB }
.darkrow2 { color: #4F4941; background-color: #E1E4EB }
.darkrow3 { color: #4F4941; background-color: #E1E4EB }
.hlight { background-color: #DFE6EF }
.dlight { background-color: #EEF2F7 }
.titlemedium { font-weight: bold; padding: 7px; margin: 0px; color: #514E4B; background-color: #E1E4EB }
.titlemedium  a:link, .titlemedium  a:visited, .titlemedium  a:active { text-decoration: underline; color: #514E4B }
.maintitle { vertical-align: middle; font-weight: bold; padding: 4px 0px 4px 5px; color: #332E27; background-color: #7E7EAF; font-size: 11px;background-image: url(/images/bar-G.gif); }
.maintitle a:link, .maintitle  a:visited, .maintitle  a:active { text-decoration: none; color: #332E27;  }
.maintitle a:hover { text-decoration: underline }
.plainborder { background-color: #CED0DA; border: 1px solid #3C362C }
.tableborder {  background-color: #D4D4D4;border: 1px solid #3C362C; width: 100%;}

.tablefill { padding: 6px; background-color: #D4D4D4; border: 1px solid #3C362C }
.tablepad { padding: 6px; background-color: #D4D4D4 }
.tablebasic { width: 100%; padding: 0px 0px 0px 0px; margin: 0px; border: 0px }
.wrapmini { float: left; line-height: 1.5em; width: 25%; font-size: 8px }
.pagelinks { float: left; line-height: 1.2em; width: 35% }
.desc { font-size: 10px; color: #4F4941 }
.edit { font-size: 9px }
.searchlite { font-weight: bold; color: #F00; background-color: #FF0 }
#QUOTE { font-family: Verdana, Arial; font-size: 11px; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px; color: #465584; background-color: #FAFCFE; border: 1px solid #000 }
#CODE { font-family: Courier, Courier New, Verdana, Arial; font-size: 11px; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px; color: #465584; background-color: #FAFCFE; border: 1px solid #000 }
.copyright { font-family: Verdana, Tahoma, Arial, Sans-Serif; font-size: 9px; line-height: 12px }
.codebuttons { font-size: 10px; font-family: Bookman Old Style, verdana, helvetica, sans-serif; vertical-align: middle; background-color: #D4D4D4 }
.forminput, .textinput, .radiobutton, .checkbox { font-size: 11px; font-family: Bookman Old Style,verdana, helvetica, sans-serif; vertical-align: middle; background-color: #D4D4D4 }
.thin { padding: 6px 0px 6px 0px; line-height: 140%; margin: 2px 0px 2px 0px; border-top: 1px solid #FFF; border-bottom: 1px solid #FFF }
.purple { font-weight: bold; color: purple }
.red { font-weight: bold; color: red }
.green { font-weight: bold; color: green }
.blue { font-weight: bold; color: blue }
.orange { font-weight: bold; color: #F90 }

What version of Firefox are you using? I am on version 1.04 and compared it to IE 6 and they both look the same to me. I don't see any problems with the right menu. Maybe it is your browser version?

Kaiman

Glenwood Springs, CO - Website Design and Hosting

I had to change the site back for now. It was causing too many problems.

Basicly when the width was not fixed the contents divs would streach and cover the menu div in the new version of Firefox, but in IE they would stop and sit next to the menu divs.

I think I may have to look into much more of a major skin redesign to make it work.