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

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?

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

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.

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/

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.

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

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

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

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