hjælp til DIV tag med Javascript?

hvad mener du? Der behøves ikke javascript for at få divisions til at følge pageflowet.

kan du ikk give et eksempel ? jeg er ikke helt med på hvad det er du vil.

Jeps ok!

Problemet opstår når jeg har en masse indhold i et <div> tag ser det fint ud i et IE men i firefox og opera "flyder"/"overlapper" indholdet udover <div> tagget!


mvh
mads

ps! ved ikke om det er forklaring nok!

<ole>

Vi kan jo ikke se hvilke fejl, du laver - og det må du helt afgjort gøre  :)
Prøv med et link til siden

/mvh
</bole>

Jeg tror egentlig godt jeg kender problemmet, som du omtaler, og skyldes nogle forskellige fortolkninger af height-begrebet fra de forskellige browsere. Har du fx en div der hedder:
<div id="boks">
--- rigtig meget indhold
</div>
og sætter stylen til:
#boks {
      width:300px;
      height:100px;
      background-color:#ff0;
  }

Så vil IE automatisk udvide boksen hvis der kommer for meget indhold (over 100px), mens Mozilla og Opera tager height mere bogstaveligt og dermed bliver div'en aldrig højere end de 100px.

Der findes et lille trick, som udnytter IE's manglende understøttelse af flere forskellige css-selectore, fx >-selectoren. Dermed kan problemmet omgås ved at tilføje:
BODY > #boks {
      height:auto;
      min-height:100px;

  }
til dit stylesheet.

--> olebole...desværre serveren er nede så at smide et link har ingen meing lige i øjeblikket!

--->skovenborg lige præcis det er det der er problemet!!

jeg vil lige teste det du skriver det ser ihvertfald ud til at være en fornuftig øsning!

mvh
Mads

--->skovenborg!!

Smid et svar! det var lige det jeg stod og manglede!

og tusind tak til jer andre også!

mvh
mads

det lyder godt :-)

Om tricket også vil virke når IE7 udkommer er så spørgsmålet, men indtil da virker det tilstrækkeligt i forhold til en eventuel javascript-løsning (som jeg ikke tror vil være særlig hensigtsmæssig i dette sammenhæng). Vi kan så bare håbe på at Microsoft også inkluderer min-height i deres kommende browser, for så ville der jo intet problem være.

Du kan også skrive:

#boks {
    display: table-cell;
    height: 100px;
    width:300px;
    background-color:#ff0;
}

- eller det 'gamle svin' fra 90'ernes værktøjskasse:

<style type="text/css">
#boks {
    width:300px;
    background-color:#ff0;
}
.cSpacer {
    width: 1px;
}
.h100 {
    height: 100px;
}
</style>

<div id="boks">
<img class="cSpacer h100" align="right" src="http://www.eksperten.dk/img/t.gif">
--- rigtig meget indhold
</div>

- ikke smuk, men dog en mulighed. Jeg vil dog kraftigt anbefale én af de to andre ... og på sigt er skovenborgs det, der semantisk giver bedst mening (i mit kodeho'de)  :)

--> olebole...du har virkelig styr på det css/html/dhtml! (godt du ikke forlod eksperten.dk alligevel)!

tusind tak for hjælpen skovenborg & olebole godt at vide at i er herinde så vi andre beginners kan få hjælp!


mvh
Mads

Selvtak. Jeg har vist bare 'fedtet hår', så tingene bliver hængende, når jeg ser en løsning eller læser noget på W3C - og så har viden det med at gøre det lettere at opnå mere viden. Jo mere, du lærer, jo mere logisk og naturligt hænger ny viden sammen med det, du i forvejen ved - og bliver derved lettere at huske.
Morale: Undlad at vaske hår - og læs en masse. Så kommer det hele af sig selv  :D

Det var så lidt.

Godt tip det med håret, det må jeg huske mens jeg læser til eksamen ;-)

Dagens Tip: Skabshuskere kan bruge voks  :)

Hårdvoks ?-)