Gå til innhold

Lite problem med at div-elementet ikke følger siden helt ned.


Anbefalte innlegg

Hei, begynte med HTML + CSS for en stund siden, og div-elementer for noen dager siden, så kan v're mulig at jeg har satt det opp veldig tungvindt. Bare å si ifra om det finnes en bedre metode.

 

Har laget en side, med logo, meny og innhold. Prøvde å sette 2 div-elementer på hver side, med 15% av skjermen på hver. Men når jeg fyller siden med tekst, så jeg må scrolle, så stopper de opp. De vil ikke følge med. Om jeg setter de mer enn 100%, så vil de gå lenger ned enn siden uten at jeg behøver å scrolle for å se hele teksten.

 

Litt vanskelig å forklare, men håper du skjønner hva jeg mener.

 

Her er css-koden:

 

 

h1 {
text-align:center;}


div {background-attachment:fixed;}

.Text {font-family:"Trebuchet MS";}


body {
background-image:url(../Pictures/blue-abstract-1-JR.jpg);
margin-left:16%;
margin-right:16%;}


#margin-left {background-image:url(../Pictures/free_2048809.jpg);
position:absolute;
right:0px;
top:0px;
height:100%;
width:15%;}

#margin-right {background-image:url(../Pictures/free_2048809.jpg);
position:absolute;
left:0px;
top:0px;
height:100%;
width:15%;}

ul {
list-style-type:none;
margin:0;
padding:0;
overflow:hidden;}

li {
float:left;
text-align:center;
margin-left:0px;}

a:link,a:visited{
display:block;
width:207px;
font-weight:bold;
color:#FFFFFF;
background-color: #003300;
text-align:center;
padding:5px;
text-decoration:none;
text-transform:uppercase;}

a:hover,a:active{
background-color: #009900;
text-decoration:underline;}

 

 

 

HTML-koden:

 

 

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Nyheter</title>

<link href="../CSS/Stilark.css" rel="stylesheet" type="text/css" />
</head>

<body class="Text">

<div id="margin-left">
</div>

<div id="margin-right">
</div>

<div align="center"><img src="../Pictures/Logo.png" /></div>

<hr />
<ul>
<li><a href="Index.html">Hjem</a></li>
   <li><a href="Nyheter.html">Nyheter</a></li>
   <li><a href="Om oss.html">Om oss</a></li>
   <li><a href="Kontakt oss.html">Kontakt oss</a></li>
</ul>
<hr />

<h1>Nyheter</h1>

</body>
</html>

 

 

 

En ting til.

Nå er det sånn at meny-knappene er best av pixler, så hvis du har større skjerm enn at de passer akkurat (1280x800 om jeg ikke tar feil), så ser det stygt ut.

Hvordan kan jeg gjøre sånn at knappene (listen), vil strekke seg langs hele "hr-streken", uansett skjerm-oppløsning?

 

Takker for all hjelp :)

Endret av Fred7555
Lenke til kommentar
Videoannonse
Annonse

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
×
×
  • Opprett ny...