CSS problemer

Tags:    css clear div

Hej udviklere.

Har virkelig et problem som jeg håber I kan hjælpe mig med.

Billede af resultat

Hvordan får jeg (se nedenstående kode) forum_overall - til at følge forum_content. Se eventuelt billede.

Fold kodeboks ind/udCSS kode 


Skal I have flere informationer, så spørg bare. Har driblet rundt med det her problem i flere aftenener. :(

PS: Skal naturligvis ikke have den sorte border omkring, men bruger den til at følge det resterende indhold og teste - og lige nu virker det bare kun ved selve tråden, men kommentarerne der halter den. :(

I de andre tråde lader det til at min .forum_overall kun følger forum_content - men hvis denne er mindre end forum_info, så fucker det hele op. Håber I forstår, jeg gør ikke.

Et billede mere..

Mvh. Morten



Indlæg senest redigeret d. 06.07.2013 13:25 af Bruger #17610
6 svar postet i denne tråd vises herunder
2 indlæg har modtaget i alt 7 karma
Sorter efter stemmer Sorter efter dato
Det er et clearing-problem, opstår når der benyttes floats.

Løsningerne er mange, og alle er beskrevet her: http://www.udvikleren.dk/forum/40046/div-i-divs/



Hvorfor er det du vil bruge et clearfix overhovedet?

#wrapper {
overflow:hidden;
}
#div1,
#div2{
float:left;
}

Da du har en overflow på din wrapper, vil den automatisk tilpasse sig!




Andreas

Blot så du er klar over det. Overflow: hidden er ikke den bedste løsning, da den kan skabe nogle problemer i visse situationer, som f.eks. CSS3's box-shadow. :)

http://www.themepartner.com/blog/61/dont-use-overflowhidden-for-clearing-floats/



Tusinde tak for svarene, utroligt at sådan et stort problem kan løses med én linje.

Tak tak, god sommer :)



@Michael Larsen

Jeg er klar over at det kan have et par komplikationer. Men i de fleste situationer anbefaler jeg stadig at gøre dette. Du skal også huske på at brugere som benytter f.eks. tablets eller smartphone ikke kan se hvad der er udenfor din #wrapper. Hvis du som udgangspunkt altid arbejder indenfor kassen, vil du aldrig opleve noget problem.

Har du derimod brug for at arbejde udenfor kassen, kan du selvfølgelig bruge en #div til at #clear med. :-) Jeg synes personligt ikke der er nogen grund til at arbejde med #clear, da det ikke giver nogen semantisk mening.

Et alternativ er at du kan smide #float på din wrapper også, hvorefter du får den smidt i midten ved brug af margin og position. :-)



@Andres

Fair synspunkt, men læser du nedestående link, som jeg også henviser til fra andet indlæg (der henvises til fra dette indlæg), så synes jeg at dine argumenter udvandes en smule. :)

http://css-tricks.com/snippets/css/clear-fix/



t