Forum Moderators: not2easy
This is how it looks: <>
This is what I want: <>
My doctype is:
XHTML 1.0 Transitional
This is a stripped down version of my XHTML:
<body>
<div id="sidcontainer">
<div id="logotype"><img src="bilder/logotype.gif" /></div>
<div id="logotext"><img src="bilder/logotext.gif" /></div>
<div id="meny">
<a href="index.php">HEM</a> ¦
<a href="matcher.php">MATCHER</a> ¦
<a href="tipsa-om-match.php">TIPSA OM MATCH!</a> ¦
<a href="lankar.php">LÄNKAR</a> ¦
<a href="kontakta.php">KONTAKTA</a>
</div>
<div id="kontenta">
<h1>OM COOKIES</h1>
<p>Den här...</p>
<div id="menynere">
<p>fotbolliveckan<strong>.nu</strong></p>
<p>Copyright © 2008</p>
<a href="tipsa-om-match.php">Tipsa om match!</a> ¦
<a href="kontakta.php">Kontakta</a> ¦
<a href="om-cookies.php">Om cookies</a> ¦
<a href="http://validator.w3.org/check?uri=referer">XHTML</a> ¦
<a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a>
</div>
</div>
<div id="annonsfalt">
<script type="text/javascript">
<!--
google_ad_client = "pub-0123012301230123";
//-->
</script>
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>
</div>
</div>
</body>
This is a stripped down version of my CSS:
html, body {
margin: 0;
padding: 0;
background: #a0a0a0
url(../bilder/bakgrund.jpg)
repeat-x;
/* Textinställningar */
font-family: Georgia, Tahoma, Arial, Helvetica, Verdana, Sans-serif;
}#sidcontainer {
/* Ändra detta värde till sidans totalbredd i pixlar */
width: 944px;
margin-left: 16px;
}
#logotype {
width: 384px;
height: 224px;
float: left;
/* Textinställningar */
text-align: center;
}
#logotext {
width: 384px;
height: 224px;
float: left;
/* Textinställningar */
text-align: center;
}
#meny {
width: 752px;
height: 16px;
padding: 8px;
clear: both;
background: url(../bilder/meny.gif);
/* Textinställningar */
font-family: Tahoma, Arial, Helvetica, Verdana, Sans-serif;
font-size: 12px;
font-weight: bold;
color: white;
}
#kontenta {
width: 752px;
margin-top: 16px;
margin-right: 16px;
padding: 8px;
float: left;
background: white
url(../bilder/kontenta.gif)
no-repeat;
/* Textinställningar */
font-size: 12px;
color: green;
}
#menynere {
width: 752px;
padding-top: 16px;
clear: both;
/* Textinställningar */
font-family: Tahoma, Arial, Helvetica, Verdana, Sans-serif;
font-size: 10px;
font-weight: bold;
text-align: center;
}
#annonsfalt {
margin-top: 16px;
float: left;
}
I would really appreciate it alot if anyone could help me out!
Thanks!
[edited by: SuzyUK at 8:19 am (utc) on April 19, 2008]
[edit reason] sorry no personal links, see charter [/edit]
[edited by: jatar_k at 6:15 pm (utc) on April 19, 2008]
[edit reason] no urls thanks [/edit]
you can stretch a container vertically by putting default content inside the contained divs. A 400px high jpeg for a navbar background could do the trick to stretch it at least 400px.
There must be other ways too. On the general you want a flexible container, so it stretches as content flows in. One way to putting some content at a "blank" container site is to build a really high footer.
Finally you can try using height for the container, but i am not sure if that has the desired effect, at least not cross browser imho.
best
rept