Ustawianie właściwości width w % dla elementów z display : inline-block

2016-08-31 18:02
0

Jeśli jakiś element ma ustawiony display : inline-block to w przypadku ustawienia właściwości width wyrażonej w procentach, szerokość obliczana jest na podstawie szerokości dziecka a nie szerokości rodzica tak jak ma to miejsce w przypadku displa : block. Da się jakoś zrobić aby szerokość była obliczana na podstawie szerokości rodzica a nie dziecka?

Pozostało 580 znaków

2016-08-31 18:05
Zimny Wacław
0

Eeee wtf?
Ustaw szerokość rodzica np na 1000px
Ustaw szerokość dziecka (które ma display: inline-block) na 10% - sprawdź ile px ma ten element

Pozostało 580 znaków

2016-08-31 18:12
0

Aktualnie nie mogę ustawiać niczego "na sztywno". Wszystkie szerokości chcę podawać w % aby dostosowywało się do szerokości okna przeglądarki.

Chodzi mi o to, że mam jeden div z szerokością na 90 %. W środku są 4 divy z display : inline-block i chcę aby zawsze stanowiły one max 25% szerokości tego na zewnątrz. Takie menu z 4 przyciskamo które się rozszerza i zwężą w zależności od szerkości okna.

Wszystko byłoby o.k gdyby nie fakt, że display : inline-block powoduje, że oblicza szerokość na podstawie nie elementu obejmującego tak jak ja bym chciał tylko na podstawie tego co w środku.

Pozostało 580 znaków

2016-08-31 18:39
Zimny Wacław
0

szerokość obliczana jest na podstawie szerokości dziecka a nie szerokości rodzica tak jak ma to miejsce w przypadku displa : block

Chodziło o to, że pomyliłeś rodzica z dzieckiem.
Szerokoć dzieci jest obliczna na podstawie szerokości rodzica.
Przeglądarka przelicza % na piksele, wartość 100% to cała szerokość lub wysokość okna szerokość przeglądarki (bez paska przewijania itd) np 1000px
Rodzic (jakiś div, cokolwiek) może mieć 90% czyli 900px
Dzieci (wewnątrz rodzica) mając po 25% będą mieć po 225px.

Poczytaj jakiś kurs html/css bo widzę, że będziesz zadawał za dużo zbędnych pytań.
Ja kilka dobrych lat temu uczyłem się z tego - http://www.kurshtml.edu.pl/

Pozostało 580 znaków

2016-08-31 19:47
0

No właśnie chodzi o to, że z obserwacji wynika iż nie pomyliłem. Na stackoverflow też pisali, że w przypadku elementów z display : inline-block szerokość w % oblicza się według długości dziecka a nie rodzica i u mnie rzeczywiście to tak działa.

Pozostało 580 znaków

2016-09-01 00:01
Zimny Wacław
0

Wrzuć kod na jsfiddle.net i pokaż gdzie rodzic dziedziczy długość po dziecku

Pozostało 580 znaków

2016-09-01 01:32
0

https://jsfiddle.net/4n5syo6o/2/

Pozostało 580 znaków

2016-09-01 11:28
Zimny Wacław
0

Używasz max-width a nie width dlatego szerokość elementu dostosowuje się do szerokości zawartości (w tym przypadku tekstu).
Jeśli wpiszesz dłuższy tekst to max-width ograniczy szerokość do tych 25% tzn element nie będzie szerszy niż 25% rodzica

Pozostało 580 znaków

2016-09-01 11:51
0

Fakt, pomieszałem trochę - jestem rotrzepany niestety :/

Pozostało 580 znaków

Liczba odpowiedzi na stronę

1 użytkowników online, w tym zalogowanych: 0, gości: 1, botów: 0