Avatar billede nasas Nybegynder
09. marts 2012 - 15:05 Der er 8 kommentarer

Float: til venstre og OPAD

Hej Eksperter :)

Jeg har et lille problem med at få et div-tag til at floate rigtigt. Er i gang med at lave et galleri til billeder og så ser det jo dumt ud med for meget mellemrum hvor der ingenting er :)

Sådan som jeg gør:
[code]

------  ------  ------  ------
|  1 |  |  2 |  |  3 |  |  4 |
|    |  |    |  |    |  |    |
------  |    |  ------  ------
        |    |
        |    |
        ------
------
|  5 |
|    |
------
[/code]

Som i kan se kommer nummer 5 helt neden under linjen hvor nummer 2 er.


Sådan skal det se ud:

[code]
------  ------  ------  ------
|  1 |  |  2 |  |  3 |  |  4 |
|    |  |    |  |    |  |    |
------  |    |  ------  ------
------  |    |
|  5 |  |    |
|    |  ------
------
[/code]
altså så de flyder mere sammen så der ikke kommer alle de blanke tomme felter :)

på forhånd, TAK :)
Avatar billede tobrukDk Novice
09. marts 2012 - 15:19 #1
1 og 5 skal være flort left og de skal være lige efter hinanden

clear:both til 5 eller 1  ellers skal det nok være 2 . men det været meget bedre hvis vi kun se lidt kode fra din hjemmeside :)
Avatar billede nasas Nybegynder
09. marts 2012 - 15:28 #2
Det er fordi jeg henter dem ud fra en database og så sætter jeg dem alle til at være ens og have den samme bredde, men højden er ikke den samme..
Har lavet 2 forskellige for at lave forskellige højder:

[code]
#divB {
    background-color: #FF0000;
    height: 100px;
    width: 100px;
    float: left;
    margin: 2px;
}
#divA {
    background-color: #FF0000;
    height: 250px;
    width: 100px;
    margin: 2px;
    float: left;
}

[/code]
<div id="divB">
        1
    </div>
    <div id="divA">
        2
    </div>
    <div id="divA">
        3
    </div>
    <div id="divB">
        4
    </div>
    <div id="divB">
        5
    </div>
    <div id="divB">
        6
    </div>
    <div id="divA">
        7
    </div>
    <div id="divB">
        8
    </div>
    <div id="divA">
        9
    </div>
Avatar billede olebole Juniormester
09. marts 2012 - 15:35 #3
<ole>

Det kan du ikke uden videre løse med float. Det kræver, du laver om på din rækkefølge - alt efter højden. Da det sikkert ikke er muligt, må du i stedet ændre dit design, så det passer til teknologien

/mvh
</bole>
Avatar billede nasas Nybegynder
09. marts 2012 - 15:40 #4
Her er det gjort: http://www.friendsheet.com/

ved så ikke lige hvordan :)
Avatar billede olebole Juniormester
09. marts 2012 - 15:46 #5
Så kik i kildekoden
Avatar billede nasas Nybegynder
09. marts 2012 - 15:47 #6
det har jeg gjort men kan ikke finde det... det ser ud som om der er sat mål på hver eneste...
Avatar billede olebole Juniormester
09. marts 2012 - 16:05 #7
Tja ... det er der jo ingen af os andre, der kan vide noget om. Et billede siger ikke noget brugbart
Avatar billede tobrukDk Novice
09. marts 2012 - 16:24 #8
jeg tror godt ved hvad han mener men jeg ved ikke helt hvad du søger efter 100%...
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
Kurser inden for grundlæggende programmering

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.

Du kan også logge ind via nedenstående tjenester