Gå til innhold

Posisjonering av diver

raider000

Av raider000
i Programmering og webutvikling

Anbefalte innlegg

raider000

raider000

Skrevet
Skrevet

Har tre diver på siden av hverandre på nettsiden min hvor den midterste er Innholdsdelen, og som er "redigerbar" i de andre sidene mine. Når jeg etterhvert skriver i denne, blir den jo lenger og lenger. Men når jeg lagde diven, lagde jeg også en høyde. Hva om jeg vil at denne høyden regulerer seg etter hvor mye tekst jeg har? Men samtidig ha en minsteverdi, går det an?

 

Hvordan kan jeg også alltid få en annen div til å ligge under denne?

Lenke til kommentar

Videoannonse

Videoannonse
Annonse
Azidops

Azidops

Skrevet
Skrevet (endret)

Spørmsål 1:

Maks høyde settest med max-height

 

MEN: Det begrenser bare høyden på innholdet tagen, ikke innholdet. Problemet er vist i denne linken

 

Du kan eventuelt legge til en scrollbar hvis innholdet blir for stort. Legg merke til IE-hacken:

 div{
   height: expression( this.scrollHeight > 332 ? "333px" : "auto" ); /* sets max-height for IE */
   max-height: 333px; /* sets max-height value for all standards-compliant browsers */
   overflow:auto;
}

 

 

Spørsmål 2:

 

div#blokkA {
display: block;
clear: both;

//Eventuelt for gjennbruk med class i stedet for id
div.blokkA {
display: block;
clear: both;
}

 

Clear: both; gjør at ingen andre tager kan ligge til venstre eller høyre for denne tagen (blokkA). Da vil neste tag (som kan f.eks være en div) falle under denne. BlokkA vil også falle under tagen den etterfølger.

 

I ditt tilfelle der 3 diver skal ligge ved siden av hverandre ville jeg gjort følgende:

div#container {
 ... ønsket formatering ...
 ligger rundt de andre divene
}

div#venstre {
display: block;
float: left;
clear: left;
}
div#midt {
display: block;
float: left;
}
div#hoyre {
display: block;
float: left;
clear: right;
}

Du er også nødt til å la div#venstre være den første du angir i HTML-koden. Float: left; angir at den skal legge seg til inntil nærmeste tag fra venstre.

 

<html>
<head>
</head>
<body>

<div id=container>
<div id=venstre>Jeg ligger til venstre</div>
<div id=midt>Jeg er i midten :-)</div>
<div id=hoyre>Jeg ligger til høyre</div>
</div>

</body
</html>

Endret av Azidops
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å
Gå til emneliste
×
×
  • Opprett ny...