• 38 929 online
  • 1 198 473 medlemmar
  • 62 096 181 inlägg
2018-11-05, 23:55
  #1
Medlem
Jag håller på med en kalender i php och skriver ut alla datum i egena <nav>. Då den kommer ligga på fler ställen skulle jag vilja ha en skalbar. Fast height blir väldigt klurigt då 14.28% oftast blir betydligt mindre på höjden. Finns det något smart sätt att göra det på?
Tänkte om man kunde skriva något som räknar ut rätt höjd automatiskt, har dock inte lyckats hitta något.

Kod:
nav.calendar-weekday { 
background-color: #fff;
float: left;
width: 14.28%;
height: ?
}
Citera
2018-11-06, 00:09
  #2
Medlem
Förstår inte vad det är du vill åstadkomma.
Citera
2018-11-06, 01:31
  #3
Medlem
Mia-Rovys avatar
Vill du ha lika höjd och bredd?

Padding baseras på bredden. För att.

Så padding-bottom: 100% resulterar i en padding som är 100% av bredden, alltså en fyrkant om höjden är 0.
__________________
Senast redigerad av Mia-Rovy 2018-11-06 kl. 01:35.
Citera
2018-11-06, 07:11
  #4
Medlem
Xalteds avatar
1. Använd inte float.
2. Använd flex om du vill få jämlika ”boxar” i både höjd och bredd.

Finns många exempel! Kolla antingen CSS-tricks eller kolla runt på codepen.io.

Hade annars skrivit ett konkret exempel till dig om jag inte hade suttit på mobilen.

Lycka till.
Citera
2018-11-06, 15:06
  #5
Medlem
Flex låter spännande får läsa på lite mer när jag kommer hem. Hittar dock inget om jämnhöga/breda boxar i %. Fast får leta vidare. Annars fungerade även padding-bottom får kanske blanda lite.
Citera
2018-11-09, 12:21
  #6
Medlem
Hej igen.
Tyvärr så upptäckte jag att padding-bottom inte fungerade så bra om jag ville ha text i rutan.
Vill gärna försöka få texten att hamna centrerat både höjdled och vanligt.
Slutar kanske med fasta mått ändå.
Citera
2018-11-09, 17:52
  #7
Medlem
Mia-Rovys avatar
Citat:
Ursprungligen postat av Jonas-u
Hej igen.
Tyvärr så upptäckte jag att padding-bottom inte fungerade så bra om jag ville ha text i rutan.
Vill gärna försöka få texten att hamna centrerat både höjdled och vanligt.
Slutar kanske med fasta mått ändå.
Nej för fan, akta dig för fasta mått. Det är djävulens påfund. Behöver du ange "px" någonstans har du gjort fel


How about this?
https://jsfiddle.net/fz4mb2he/


Rent tekniskt sätt så skulle flex nog inte kunna lösa vad du efterfrågar när det gäller proportionerna, då du efterfrågar en specifik proportion (där höjden och bredden är relativ till varandra, detta innebär att lösningen även fungerar med andra proportioner)

Men skiter du i proportionerna och istället bara önskar att alla boxar på en rad är lika höga så är flex vad du söker. I det läget förespråkar jag flex framför padding-lösningen. Det är ännu mer relativt, relativitet är flex stora styrka.
__________________
Senast redigerad av Mia-Rovy 2018-11-09 kl. 17:59.
Citera
2018-11-09, 20:36
  #8
Medlem
Citat:
Ursprungligen postat av Mia-Rovy
Nej för fan, akta dig för fasta mått. Det är djävulens påfund. Behöver du ange "px" någonstans har du gjort fel


How about this?
https://jsfiddle.net/fz4mb2he/

Tack. Det där verkade fungera fint
Citera