Søg
Avatar billede drinkit Praktikant
19. marts 2009 - 23:17 Der er 9 kommentarer og
1 løsning

float left divs vil ikke stå under hinanden

http://www.xup.dk/index2.php?side=links

som I kan se står de to billeder ikke under hinanden.
I mit stylesheet står der:

#link {
margin-top: 10px;
border: 1px solid #000;
    position: relative;
    float: left;
    width: 100px;
}

#linktekst {
margin-top: 10px;
border: 1px solid #000;
    position: relative;
    margin-left: 10px;
    float: left;
    width: 400px;
}


og på selve siden ser HTML'en således ud:

<div class="link">BILLEDE</div><div class="linktekst">Linktekst</div>

(og det der gerne skulle stå lige nedenunder det ovenstående:
<div class="link">BILLEDE2</div><div class="linktekst">Linktekst2</div>

Hvordan går jeg det linet pænt op?

tak!
Avatar billede zips Juniormester
19. marts 2009 - 23:25 #1
Du mangler at cleare din float indsæt dette <div style="clear:both;"></div> efter favorit designer.</p></div> og det vil virke :-)
Avatar billede drinkit Praktikant
19. marts 2009 - 23:33 #2
hvis jeg kun bruger stylesheet, og ikke vil putte det ind på siden, hvor skal jeg så sætte mit clear:both?
Avatar billede zips Juniormester
19. marts 2009 - 23:42 #3
Så skal du sætte den på dit id link her skal du huske at der kun må være en id med det navn, så ændre dem til class hvor du kan lige så mange du lyster på en side.
Avatar billede zips Juniormester
19. marts 2009 - 23:46 #4
Men jeg er ikke sikker på andet end du kommer til at indsætte en div for at få det til at virke i alle browser.

Lave en class med clear:both; og indsæt <div class="dinclass"></div> der hvor der er brug for at clare din float
Avatar billede drinkit Praktikant
20. marts 2009 - 10:38 #5
Tak.. Det virker sørma :)
Hvis du har tid, kort..

http://lostboys.dk/xup//index2.php

hvorfor er det som om der er 5px padding i min tekst til billedet.
den skal starte HELT i toppen, og ikke lidt længere nede?

Forresten, smid svar.. :) Tak for hjælpen
Avatar billede zips Juniormester
20. marts 2009 - 11:11 #6
Her er et svar :-)

Jeg kan ikke lige se de 5px afstand i de browser jeg lige har her, det er FF3, Chrome og IE6, men vil kikke på det når jeg er hjemme igen, der kan jeg også se den i IE7, Opera og Safari

Men er det ved det lille billede hvor teksten er til højre at der er de 5px?
Avatar billede drinkit Praktikant
20. marts 2009 - 13:17 #7
Jeg prøver lige at forklare om igen..
Hvis du kigger på http://lostboys.dk/xup//index2.php?side=links i FF3 så ser det fint ud (i hvert fald hos mig)!
Men hvis du kigger på siden i IE så ligner det noget der er løgn.

www.lostboys/xup/style.css det er min css fil - kan det have noget at gøre med min brug af clear: both; er forkert? eller float?
Det skal være som det er i ff3 - i alle browsere!

Og siden er W3C valideret - så forstår ik at alle browsere ik viser den ens!?

Mange tak for din tid.
Avatar billede zips Juniormester
20. marts 2009 - 13:33 #8
Som jeg skrev tidliger er alle browser ikke enige om det man gør og her hentyder jeg til at du nok skal sætte en div efter den float som du ønsker ophævet, det er nok derfor at IE ikke ser ud som i FF, men kikke på det når jeg er hjemme :-)

Som olebole plejer at skrive, eller som jeg husker det.
En valid koder er ikke ensbetydig med en god kode, men en god kode er altid en valid kode :-)
Avatar billede zips Juniormester
20. marts 2009 - 18:42 #9
Ok jeg har nu kikket lidt på din side, du har nu fået en scroll bar i bunden som skyldes at du har noget som er forbredt.

Ændre bredden i din .billedetekst til width: 386px;

Hvis du indsætte dette
p {padding: 0; margin: 0;} bliver din tekst mere ens

Jeg har testet her http://prebendahl.dk/exp/test/drinkit/
Avatar billede drinkit Praktikant
23. marts 2009 - 15:38 #10
Mange tak for al din hælp!
God dat!
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel Indlæg Oprettet Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML 18 10/09/202515:07 17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML 3 19/03/202522:16 20/03/202513:04
Se og ændre html på en webside Af magger i HTML 4 11/03/202513:55 12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML 5 02/03/202520:05 04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML 3 30/10/202409:37 01/01/202515:27
Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I går 17:38 Video ikoner Af Malm i Windows
I går 17:27 Video ikoner Af logbuilders i Windows
16/0110:29 Negativ billeder på samsung Af ALICE i Småopgaver
15/0115:45 HJÆLP - Lopslag, Indeks? Hvad gør jeg! Af Eva i Excel
14/0119:38 Webmail yousee Af nu_igen i E-mail programmer
White papers
Flere white papers »