jeg er ved at lave en template til joomla hvor layout styres af css istedet
for som traditionelt tables.
På siden er der en ramme som består af 3 stk grafik top mid & bot.
de er palceret i en "class" og med z-index 1 så de lægger sig under alt
andet.
Jeg skal så nu placere hoved indholds modulet (php stump) så den for det
første lægger sig indenfor rammen og selvfølgeligt følger rammen når siden
skalerer og endvidere skal den få rammen til tilpasse sig i højden.
Rammen (body_con_mid) er ligenu sat til 600px men den del skulle gerne bare
følge højden på body_con.
Da det hele kører på en joomla installation og da koden derfor fremtræder
ret rodet når man ser sidens kildekode tillader jeg mig at paste selve
koden og css`en ind i indlæget her.
index.php:
<?php defined( "_VALID_MOS" ) or die( "Direct Access to this location is
not allowed." );?>
<!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 if ( $my->id ) { initEditor(); } ?>
<meta http-equiv="Content-Type" content="text/html;><?php echo _ISO; ?>" />
<?php mosShowHead(); ?>
<?php echo "<link rel=\"stylesheet\"
href=\"$GLOBALS[mosConfig_live_site]/templates/$GLOBALS[cur_template]/css/template_css.css\"
type=\"text/css\"/>" ; ?><?php echo "<link rel=\"shortcut icon\"
href=\"$GLOBALS[mosConfig_live_site]/images/favicon.ico\" />" ; ?>
<link href="css/template_css.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="body">
<div class="body_con_top"></div>
<div class="body_con_mid"><div class="body_con"><?php mosMainBody();
?></div></div>
<div class="body_con_bot"></div>
</div>
</body>
</html>
css:
..body {
margin-left:auto;
margin-right:auto;
}
..body_con_top {
background-image: url(../images/top.gif);
background-position: top;
background-repeat: no-repeat;
height:23px;
z-index:1;
}
..body_con_mid {
background-image: url(../images/mid.gif);
background-position:top;
background-repeat: repeat-y;
height:600px;
z-index:1;
}
..body_con_bot {
background-image: url(../images/bot.gif);
background-position:bottom;
background-repeat: no-repeat;
height:23px;
z-index:1;
}
..body_con {
position:absolute;
top:50px;
left:200px;
width:300px;
z-index:2;
}
Har i et bud på hvad hulen jeg gør forkert her?
Siden kan ses live på
http://test.arning.dk
css på
http://http://test.arning.dk/templates/arning/css/template_css.css
--
Regards
:: J.K.Arning ::
http://yndigtland.dk ::