Gå til innhold

Enkel hjelp til css


Anbefalte innlegg

Driver og lager min første side med css istedet for tabeller og trenger litt hjelp...

 

Har følgende html:

<div id="header">
<h1>HEI OG HOPP!</h1>
</div>

<div id="left-side">
<ul>
<li><a href=".html">Noe her</a></li>
<li><a href=".html">Noe her</a></li>
<li><a href=".html">Noe annet her</a></li>
</ul>
Bare<br>noen linjer<br>
</div>

<div id="right-side">
<ul>
<li><a href=".html">Noe her</a></li>
<li><a href=".html">Noe her</a></li>
<li><a href=".html">Noe annet her</a></li>
</ul>
heu he!
sånn kan det går! hehe<br><br>
Tulledu
</div>


<div id="mainpane">

<h1>OVERSKRIFT</h1>
<p>Blablablablabla.</p>
<p>E I R I K</p>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>MAsse linjeskift for morroskyld!<br><br><br>Litt mer linke<br>skift
</div>

 

 

Og følgende css:

#header {
clear: both;
margin-left: 20px;
margin-right: 20px;
text-align: center;
background : #A3A3A3;
}

#footer {
clear: both;
background : #A3A3A3;
}

#mainpane {
   border-bottom: 1px solid #000000;
   margin: auto;
   width: 80%;
   border-top: 0px;
   background-color: #FFFFFF;
   border-top: 1px solid #000000;
}

#content {
   padding: 10px;
   margin : 10px;
   width: auto;
}

#right-side {
   width: 170px;
   border-left: 1px dashed #000000;
   padding: 10px;
   vertical-align: top;
   float: right;
   background-color : #FFFFFF;
}

#left-side {
   width: 170px;
   border-right: 1px dashed #000000;
   padding: 10px;
   vertical-align: top;
   float : left;
   background-color : #FFFFFF;
}

body {
   font-size: 10pt;
   margin: 0;
   background-color: #D2DFF2;
   font-size: 10px;
   font-family: verdana, arial, helvetica, sans-serif;
   margin-bottom: 30px;
}

 

 

Dersom dere ser på siden ser dere at noe er galt...

Hvordan kan jeg fikse dette?

Og hvordan får jeg de to elementene på sidene til å være like høye som elementet i midten?

 

Takker for all hjelp! :thumbup:

Lenke til kommentar
Videoannonse
Annonse

Hva med å endre #content til:

 

//dårlig kode

 

Bare et forslag.. ikke testet.

 

EDIT: hvis du vil at alle kolonnene må du nok ty til litt juksing: http://www.alistapart.com/articles/fauxcolumns/

 

EDIT2: uff.. leste ikke koden din ordentlig.. denne funker:

 

#mainpane {

border-bottom: 1px solid #000;

margin:0 200px;

width: auto;

border-top: 0px;

background-color: #FFFFFF;

border-top: 1px solid #000;

}

Endret av MBaardsgaard
Lenke til kommentar

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å
  • Hvem er aktive   0 medlemmer

    • Ingen innloggede medlemmer aktive
×
×
  • Opprett ny...