Centreren van divs wil niet lukken
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 -
en als je in de plaats van <div> gebruik maakt van <span>
Dan worden ze 100% breed (waarom?) en dus onder elkaar.
daarna margins toevoegen ?
Het kunnen er ook 3, 4 of nog meer worden.
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.
Het moet toch gewoon met css kunnen lijkt mij.
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 !)
Je vergeet te clearen denk ik?
Maar dan in het midden,
Top GP, nette oplossing :-)
- 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
En als alle browsers dan ook nog hetzelfde zouden reageren, dan was de wereld helemaal mooi!
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.