Søg
Avatar billede donslund Nybegynder
02. november 2008 - 08:19 Der er 7 kommentarer og
1 løsning

Centrering i div

Det er formentlig et simpelt spørgsmål, men jeg kan ikke finde løsningen.

Jeg har denne kode:

<div id="out">
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
</div>

På "item" er der en "float:left" og der for vil de ikke stå centreret inden i "out" selv om den har en "text-align:center".

Hvad er løsningen på dette?
Avatar billede zips Juniormester
02. november 2008 - 08:37 #1
Hvad mener du med at centerer item inden i out, kan du ikke smide out og item css style ind så vi kan se dem.
Avatar billede donslund Nybegynder
02. november 2008 - 08:58 #2
#out {
text-align: center;
padding-top: 14px;
}
.item {
float: left;
padding-left: 10px;
padding-right: 10px;
}

Den samlede bredde af mine "item" er ikke lige så bred som "out". Derfor skal de centreres inde i "out". Lige nu står de til venstre.
Avatar billede zips Juniormester
02. november 2008 - 09:27 #3
Så længe der ikke er en width på din item kan den ikke centere teksten da den ikke ved hvad den skal centere efter.
Avatar billede donslund Nybegynder
02. november 2008 - 09:35 #4
Sikke da noget bøvl. Mine "item" har ikke nogen fast width. Jeg må finde en anden løsning så. Tak.
Avatar billede roenving Novice
02. november 2008 - 11:06 #5
Divs er block-level elementer og må ikke flytte sig efter text-align, der alene må berøre inline-elementer ...

-- du skal kende den samlede bredde på dine items, hvis du vil centrere dem !-)
Avatar billede donslund Nybegynder
06. november 2008 - 09:51 #6
Så er navigationen lavet om og centreret.

Smid et svar hvem som vil have point.
Avatar billede zips Juniormester
06. november 2008 - 18:05 #7
Her er et svar :)
Avatar billede zips Juniormester
12. november 2008 - 22:41 #8
Tak for point :)
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 09:37 hvilken AI synes I er bedst? Af jcr18 i Andre onlineløsninger
22/0518:51 Pausepil på youtube i chrome Af valby i Browsere
22/0511:42 Mail med endelsen ".lat" Af ErikHg i E-mail
21/0511:48 Nyåbnede sider flimrer på Android tablet, hvorfor Af annam i Andet software
21/0511:03 Bitlocker fordele-ulemper, samt nulstille PC Af Uvanga i Windows
White papers
Flere white papers »