Hej!
När jag gör hemsidor lyckas jag alltid dra med mej ett återkommande problem som jag nu har fått nog av. Jag har lyckats komma runt det en del gånger men nu går det mej på nerverna att jag inte lyckas ställa det till rätta.
Jag bygger min hemsida enbart med CSS och XHTML och den är uppbyggd utav divvar.
Jag ska visa er problemet genom den här skärmdumpen:
Skärmdump
Där det står <body> är ju själva bodyn såklart men som ni ser så tar den över innehållet på sidan. <div id="kolumn"> är själva innehållet på sidan och det ljus ljus gröna ska sträcka sig från linjen under menyn till linjen över där det står "Jöran Briding". Men det gör den ju inte och gaah jag fattar inte varför x(
Här är en del av CSS koden:
body {
color: #000;
background: #53A653;
width: 800px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.7em;
margin: 0 auto;
}
/*sidhuvud*/
#sidhuvud {
color: #000;
width: 800px;
height: 230px;
background-image: url(Bilder/header.jpg);
}
/*meny*/
#menycontainer{padding-left: 4em; padding-top: 1em; border-bottom: 1px solid #000000; background: #53A653;}
#menycontainer ul{padding: 0.4em 0; margin: 0; font: 80% Verdana, Helvetica, sans-serif;}
#menycontainer li{margin: 0; display: inline; list-style: none;}
#menycontainer li a{text-decoration: none; padding: 0.4em 2em; margin-left: 1em; background: #83EC83;
border: 1px solid #000; border-bottom: none;}
#menycontainer a:link{color: #000000;}
#meny a:visited{color: #000000;}
#menycontainer a:hover{border-color: #990000; background: #DAF9DA;}
#menycontainer a#current{background: #DAF9DA; border: 1px solid #000000; border-bottom: 1px solid #DAF9DA; color: #000000;}
/*sidmeny*/
#sidmeny {
color: #990000;
background: #fff;
float: right;
width: 195px;
}
.metta p{
width: 170px;
padding-right: 5px;
padding-left: 0px;
}
.metta {
background-color: #AFF3AF;
color: #990000;
margin: 5px 5px 45px 5px;
}
/*Innehåll*/
#kolumn {
color: #000;
background: #DAF9DA;
width: 800px;
}
#kolumn p {
line-height: 1.7em;
margin: 7px 0px 0px 20px;
width: 343px;
}
#kolumn a {
margin-top: 15px;
}
#kolumn a:link {
color: #785042;
text-decoration: none;
}
#kolumn a:visited {
color: #785042;
text-decoration: none;
}
#kolumn a:hover {
color:#D2B1A4;
}
/*sidfot*/
#sidfot {
color: #333333;
background: #53A653;
clear: both;
height: 20px;
border-top: 1px solid #cccccc;
border-bottom: 4px solid #53A653;
}
#sidfot p {
margin: 7px 0px 7px 20px;
font-size: 0.9em;
}
#sidfot a:link {
color: #2453C1;
text-decoration: none;
}
#sidfot a:visited {
color: #2453C1;
text-decoration: none;
}
#sidfot a:hover {
color:#000;
text-decoration: underline;
}
Och här är XHTML koden:
<!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="sv" lang="sv">
<head>
<title>Jöran Briding</title>
<meta http-equiv="content-type" content="text/xhtml+xml; charset=iso-8859-1" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<link href="mall.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="sidhuvud">
</div>
<div id="menycontainer">
<ul id="meny">
<li id="active"><a href="index.html" id="current">Hem</a></li>
<li><a href="buddhism.html">Livet, Buddhism & VBV</a></li>
<li><a href="litteratur.html">Litteratur</a></li>
<li><a href="fotogalleri.html">Fotogalleri</a></li>
<li><a href="lankar.html">Länkar</a></li>
<li><a href="kontakt.html">Kontakt</a></li>
</ul>
</div>
<div id="kolumn">
<div class="text_right"><p>Min tolkning av Metta sutta, en av texterna i Dhammapada.<br /><br />
<span class="liten_text">(Dhammapada är en av de viktigaste textsamlingarna i Palikanon. (Pali är ett fornindiskt språk.) Metta = allomfattande ovillkorlig kärlek (ej fysisk). Sutta = berättelse– text.)</span><br /><br />
Utveckla <span class="bold">metta</span> till alla varelser i hela världen, oberoende av kön, ursprung, åsikter eller gärningar.<br />
På detta sätt kommer du att vara spontant etisk och uppnå fulländad <span class="bold">insikt.</span><br />
Och genom att ge upp begär efter sinnesnjutningar, kommer du att, slutligen, helt och hållet, bli <span class="bold">fri!</span>
</p><br /></div>
<h2>Välkommen till Jörans hemsida</h2>
<p>Den här sidan handlar om saker som jag tycker är viktiga
men också om mer personliga detaljer. Man kan hitta böcker som jag tycker är läsvärda och intressanta. Det finns också foton, gamla och nytagna.
</p>
</div>
<div id="sidfot">
<p>Jöran Briding 2008</p>
</div>
</body>
</html>
Förlåt för att det här inlägget blev jätte långt och jobbigt, men jag måste verkligen ha hjälp med att reda ut vad det är jag gör fel.
/Emelie