Centreren van divs wil niet lukken
Hallo,
Ik heb een div waar de tekst in het midden staat (margin:auto). Prima.
Nu wil ik in die div twee andere divs zetten, maar achter elkaar.
Ze staan nu mooi in het midden, maar onder elkaar.
Geef ik een float:left mee dan staan ze links, maar weer wel achter elkaar.
Hoe krijg ik ze nou in het midden en ook achter elkaar?
SanThe
Ik heb een div waar de tekst in het midden staat (margin:auto). Prima.
Nu wil ik in die div twee andere divs zetten, maar achter elkaar.
Ze staan nu mooi in het midden, maar onder elkaar.
Geef ik een float:left mee dan staan ze links, maar weer wel achter elkaar.
Hoe krijg ik ze nou in het midden en ook achter elkaar?
SanThe
Gewijzigd op 17/11/2014 23:22:09 door - SanThe -
Nee, want het aantal divs die gecentreerd moeten worden varieert.
Het kunnen er ook 3, 4 of nog meer worden.
Het kunnen er ook 3, 4 of nog meer worden.
hmm, misschien via jquery ?
Dus bijv in je .container zitten 3 divs, via jquery het aantal div's laden met een speciale class ( voor nu .center ).
Dan zou je een loop kunnen uitvoeren en eventueel een addclass met position absolute en margin op % ?
Ben geen held in js maar ik denk dat het wel mogelijk is.
Dus bijv in je .container zitten 3 divs, via jquery het aantal div's laden met een speciale class ( voor nu .center ).
Dan zou je een loop kunnen uitvoeren en eventueel een addclass met position absolute en margin op % ?
Ben geen held in js maar ik denk dat het wel mogelijk is.
Ik probeer jquery juist te vermijden. Gebruik het nog steeds nooit.
Het moet toch gewoon met css kunnen lijkt mij.
Het moet toch gewoon met css kunnen lijkt mij.
1 class .centreren maken daar position absolute maken en margin in % zetten ?
alle divs in elkaar zetten gok ik anders zul je niks aan position niks hebben denk ik.
Verder zou ik het dan niet weten. ( ga ook naar bed nu, trusten !)
alle divs in elkaar zetten gok ik anders zul je niks aan position niks hebben denk ik.
Verder zou ik het dan niet weten. ( ga ook naar bed nu, trusten !)
Moet je gewoon met een list werken. Je mag volgens Wouter ook div's in de list plaatsen.
Ik heb nu dit: http://codepen.io/anon/pen/XJWvBV
Ik heb nu dit: http://codepen.io/anon/pen/XJWvBV
De div's als "display: inline-block;" of "display: inline;"
http://codepen.io/anon/pen/Kwwwmz
http://codepen.io/anon/pen/Kwwwmz
Gewijzigd op 18/11/2014 12:24:55 door G P
- SanThe - op 18/11/2014 00:21:02:
Ik probeer jquery juist te vermijden. Gebruik het nog steeds nooit.
Het moet toch gewoon met css kunnen lijkt mij.
Het moet toch gewoon met css kunnen lijkt mij.
Uiteraard!
Daar is CSS voor.
Enkele tips:
- display: table-cell;
Op je gecentreerde <div> (waar alles in komt): iets als display: table-row; ?
Zo gebruik je gewoon je <div>'s als tabel, wat schitterend werkt en helemaal goed is :D
Allen bedankt voor de hulp.
Wat blijkt nou: Het was een kleinigheid.
Al met al een aardige tijd zitten klooien.
Ik had display:inline; en geen display:inline-block;
Geheel over het hoofd gezien.
Wat blijkt nou: Het was een kleinigheid.
Al met al een aardige tijd zitten klooien.
Ik had display:inline; en geen display:inline-block;
Geheel over het hoofd gezien.