CSS Weiche geht nicht im Template

**Grazioli** · 12.04.2008 20:07

Hallo zusammen,

ich habe ein Template selbst programiert und habe mit dem IE 5 - 6 meine Schwirgkeiten in der CSS. Der Main-Bereich wird in diesen immer grösser dargestellt. Auch beim Top-Menü habe ich be dennen ein Problem, dass das Menü übergross wird!!

Code:

<?php defined( "_VALID_MOS" ) or die( "Direct Access to this location is not allowed." );$iso = split( '=', _ISO );echo '<?xml version="1.0" encoding="'. $iso[1] .'"?' .'>';?>
<!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">
<head>

<?php mosShowHead(); ?>

<meta **********="Content-Script-Type" content="text/javascript" />
<meta **********="Content-Type" content="text/html;><?php echo _ISO; ?>" />

<?php if ( $my->id ) { initEditor(); } ?>


<!--[if gte IE 5]>
<link href="<?php echo $mosConfig_live_site;?>/templates/test/css/template_css_ie.css" rel="stylesheet" type="text/css" />
<![endif]-->

<?php echo "<link rel=\"stylesheet\" href=\"$GLOBALS[mosConfig_live_site]/templates/$GLOBALS[cur_template]/css/template_css.css\" type=\"text/css\"/>" ; ?>




</head>
<body>

<div class="wrapper">
     <div class="header"><?php mosLoadModules ('header'); ?></div>
     <div class="topNavi"><div id="topmenu" ><?php if (mosCountModules( "top" )) { ?><?php mosLoadModules ( 'top',-1); ?><?php } ?> </div></div>
     <div class="topCol">&nbsp;</div>     
	 <div class="centerCol"><div class="main"><?php mosMainBody(); ?></div></div>
     <div class="clear">&nbsp;</div>
</div>
<div class="footer">&nbsp;</div>

</body>
</html>

template_css_ie.css

Code:

div.main {
	margin-right: 40px;
	margin-left: 0px;
	left: 20px;
	right: 40px;
	max-width:600px;
	height: 100%;
	margin-bottom:60px;
	}
/* Top Menu(s) */

a.mainlevel-top {
	font-family: Tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #666666;
	text-align: center;
	padding: 6px;
	height: 80px;
	left: 609px;
	top: -4px;
	right: 20px;
	bottom: 20px;
	position: relative;
	line-height: 32px;
	vertical-align: middle;
	border: thin solid #999999;
	margin:-2px;
}
a.mainlevel-top:hover {
	font-family: Tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #666666;
	text-align: center;
	padding: 6px;
	height: 80px;
	left: 609px;
	top: -4px;
	right: 20px;
	bottom: 20px;
	position: relative;
	line-height: 32px;
	vertical-align: middle;
	border: thin solid #999999;
	margin:-2px;
	background-image: url(../images/topmenu.gif);
	background-repeat: repeat;
}
a.mainlevel-top#active_menu {
	font-family: Tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FFFFFF;
	text-align: center;
	padding: 6px;
	height: 80px;
	left: 609px;
	top: -4px;
	right: 20px;
	bottom: 20px;
	position: relative;
	line-height: 32px;
	vertical-align: middle;
	border: thin solid #999999;
	margin:-2px;
	background-image: url(../images/topmenu.gif);
	background-repeat: repeat;
	font-weight: bold;
}

template.css

Code:

div.main {
	margin-right: 40px;
	margin-left: 40px;
	left: 20px;
	right: 40px;
	width:690px;
	height: 100%;
	margin-bottom:60px;
	}
/* Top Menu(s) */

a.mainlevel-top {
	font-family: Tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #666666;
	text-align: center;
	padding: 6px;
	height: 80px;
	left: 609px;
	top: -4px;
	right: 20px;
	bottom: 20px;
	position: relative;
	line-height: 32px;
	vertical-align: middle;
	border: thin solid #999999;
	margin:-2px;
}
a.mainlevel-top:hover {
	font-family: Tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #666666;
	text-align: center;
	padding: 6px;
	height: 80px;
	left: 609px;
	top: -4px;
	right: 20px;
	bottom: 20px;
	position: relative;
	line-height: 32px;
	vertical-align: middle;
	border: thin solid #999999;
	margin:-2px;
	background-image: url(../images/topmenu.gif);
	background-repeat: repeat;
}
a.mainlevel-top#active_menu {
	font-family: Tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FFFFFF;
	text-align: center;
	padding: 6px;
	height: 80px;
	left: 609px;
	top: -4px;
	right: 20px;
	bottom: 20px;
	position: relative;
	line-height: 32px;
	vertical-align: middle;
	border: thin solid #999999;
	margin:-2px;
	background-image: url(../images/topmenu.gif);
	background-repeat: repeat;
	font-weight: bold;
}

Anbei noch die ganze Datei!!

**Grazioli** · 13.04.2008 09:53

Hallo zusammen,

ich habe es jetzt so gelöst! In der CSS für das Template habe ich jetzt folgendes eingesetzt:

Code:

* html div.main {
	margin-right: 40px;
	margin-left: 20px;
	left: 20px;
	right: 40px;
	width:600px;
	height: 100%;
	margin-bottom:60px;
	}

Dies wird vom IE 5-6 auch übernommen und es stimmt jetzt!!

Wie kann ich jetzt dies noch übernehmen?!?

Code:

/* Top Menu(s) for IE */
a.mainlevel-top {
	font-family: Tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 20px;
	color: #666666;
	text-align: center;
	padding: 6px;
	height: 80px;
	left: 605px;
	top: -4px;
	right: 20px;
	bottom: 20px;
	position: relative;
	line-height: 32px;
	vertical-align: middle;
	border: thin solid #999999;
	margin:-2px;
}

Thema: CSS Weiche geht nicht im Template

LinkBack

Themen-Optionen

Thema durchsuchen

Anzeige

CSS Weiche geht nicht im Template

Lesezeichen

Lesezeichen

Berechtigungen