CMS Made Simple Forums

Posted: **Tue Jan 29, 2008 3:00 am**

Hello everyone

I'm having a huge problem here, being a newbie and all.. so please be kind to me

I use: CMSMS 1.2.3, mysql ver. ?, linux server (webhotel).

I can't get the pagewidth fixed for IE on e.g. this page: http://www.arlu.dk/index.php?page=omgivelser. I've already read this page on the wiki: http://wiki.cmsmadesimple.org/index.php ... Page_Width. But I can't get it to work.

I'm using the grassstains template (modified), and I'd like the page width to be fixed at 780 in IE 6 (to wide) and IE7 (images go outside the frame width).

In the Content ->Global Content Block, there's no block called "JavaScript for IE page width"

Anyways, I tried to add the code suggested in the wiki, to the templates -section, but no luck. I'll post the template css and layout stylesheet below and hope, that someone out there will spend a few minutes helping me out. It's my reputation as a web designer that is at stake here, my friends

. No, seriously, please help....

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<__html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="description" content="#" />
<meta name="keywords" content="#" />
<meta name="author" content="#" />
<__script__ type="text/javascript" src="uploads/GrassStains/niftycube.js"></__script>
<__script__ type="text/javascript" src="uploads/GrassStains/niftygrassLayout.js"></__script>
<!--[if lte IE 6]>
<__script__ type="text/javascript" src="uploads/GrassStains/CSSMenu.js"></__script>
</__script>
<![endif]-->

{literal}
<__script__ type="text/JavaScript">
<!--
//pass min and max -measured against window width
function P7_MinMaxW(a,b){
	var nw="auto",w=document.documentElement.clientWidth;
	if(w>=b){nw=b+"px";}if(w<=a){nw=a+"px";}return nw;
}
//-->
</__script>
<!--[if lte IE 6]>
<style type="text/css">
#pagewrapper {width:expression(P7_MinMaxW(780,780));}
#container {height: 1%;}
</style>
<![endif]-->
{/literal}

{* The min and max page width for Internet Explorer is set here. For other browsers it's in the stylesheet "Layout: Left sidebar + 1 column" *}


{stylesheet}
<title>Bodil Arbjerg Lundby</title>
</head>
</__body>
<div class="wrap clearfix">
  <div class="header"></div>
   <div class="topnav" id="nav">
{cms_module module='menumanager' template='GrassStains : theme : CSSmenuhoriz1'  }
  </div>
	<div class="container clearfix">
  	
	<div id="content">
                  {content}
	</div>

       </div>
	<div class="footer" id="footer">        
	<p>Powered by CMSMS - Template by Culture Shock. &copy Bodil Arbjerg Lundby. Tekst og billeder må kun gengives med tilladelse.</p>
        </div>

</div>
<__body>
</__html>

Code: Select all

/* culture shock: grass stains by pogy366 - Sept. 2005 */

/******* structure and layout *******/
body {
font-family:Arial, Helvetica, sans-serif;
font-size: 9pt; 
color: #000000; 
background: #B4B8B7;
margin:10px 0 0 0;
padding:0 0 0 0;
background: #efefef url(images/bg.gif);
text-align:center;
}

.wrap {
width:780px;
margin:0 auto;
padding:0 0 0 0;
text-align:center;
background: #ffffff url(uploads/GrassStains/header.jpg) no-repeat;
border:1px solid #9EB874;
}

.header {
clear:none;
width:770px;
height:25px;
margin:100px 0 0 0;
padding:0 0 0 0;
background:transparent;
color:#ffffff;
text-align:right;
}

.topnav {
clear:both;
width:780px;
height:21px;
margin:0 0 0 0;
padding:0 0 0 0;
background:#ffffff url(uploads/GrassStains/topnav_bg_grey.gif);
font-size:8pt;
}

.container {
clear:both;
width:760px;
margin:10px 10px 0 10px;
padding:0 0 0 0;
background:#ffffff;
color:#000000;
text-align:left;
}
/*
.news_right {
float:right;
clear:both;
width:200px;
margin:0 0 5px 10px;
padding:0 10px 0 10px;
background:#CFD9BE;
color:#000000;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:8pt;
}
*/
.news p {
margin:10px 10px;
}

.news_cnr_top {
background:url(images/cnr_tr.gif) no-repeat top right;
margin:0 -10px 0 -10px;
}

.news_cnr_bottom {
background:url(images/cnr_br.gif) no-repeat top right;
margin:0 -10px 0 -10px;
}

img.cnr {
width:8px;
height:8px;
border:none;
display: block !important;
}

.footer {
position:relative;
clear:both;
width:780px;
margin:0;
padding: 0;
background:#ffffff;
font-size:8pt;
text-align:center;
border-top:1px solid #9EB874;
}
 *html body #footer{margin:10px 0 0 0;}

div#flat{clear:both;width:66%;height:38px;margin:10px 0 20px;padding:0px}
div.left49 {float:left;width: 70%;}
div.right49 {float:right;width: 15%;text-align: right;}
div.left49 p{margin:0px 20px; padding:0px}
div.right49 p{margin:0; padding:0px}


/******* links *******/

a {
color:#D3812D;
text-decoration:underline;
}

a:hover {
color:#E39243;
text-decoration:none;
}

#news a {
color:#D3812D;
text-decoration:underline;
}

#news a:hover {
color:#E39243;
text-decoration:none;
}

#footer a {
color:#9EB874;
text-decoration:none;
}

#footer a:hover {
color:#4F6C1F;
text-decoration:none;
}

/******* fonts and colors *******/

.header strong {
font-family:Verdana, Arial, Helvetica, sans-serif;
color:#ffffff;
font-size:13pt;
letter-spacing:.7em;
}

.news_title {
font-family:Arial, Helvetica, sans-serif;
color:#65764B;
font-size:10pt;
font-weight:bold;
}

.page_title {
font-family:Arial, Helvetica, sans-serif;
color:#697D55;
font-size:10pt;
font-weight:bold;
padding: 0 0 0 0;
margin: 0 0 -8px 0;
}


/******* images *******/

img {
border:none;
}

.right img{
float:right;
padding:0 0 0 0;
margin:5px 2px 2px 5px;
}

.left img{
float:left;
padding:0 0 0 0;
margin:0 5px 0 0px;
}



/******* workarounds and hacks *******/
.clearfix:after {
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

.clearfix {display: inline-table;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

Posted: **Tue Jan 29, 2008 8:48 am**

Check the min-width and max-width in the stylesheet as well for #pagewrapper. As IE6 doesnt understand the min-width/max-width logic in em's, the logic is additionally set in the template. You did change that one, you could set the width in the stylesheet to 780px as well instead of the em's.

Ronny

Posted: **Wed Jan 30, 2008 6:12 am**

If you are just trying to set the page to a fixed width use the pagewrapper like you have it, at 780px and skip the IE stuff, IE understands fixed widths...

CMS Made Simple Forums

Page width in IE

Page width in IE

Re: Page width in IE

Re: Page width in IE