Element HTML o szerokości procentowej musi mieć minimalną szerokość wewnętrznej zawartości statycznej
Witam, staram się stworzyć płynny / responsywnyukład. Czy jest jakiś sposób wymuszenia elementu HTML, który ma procentową szerokość, aby mieć minimalną szerokość wewnętrznej zawartości? Oznacza to, że jeśli zawartość wewnętrzna ma jakąś statyczną szerokość, na przykład 200px?
Oto przykład: http://www.nathanielkessler.com/div/csshelp.html
Jeśli w IE9 ustawisz tryb Quirks i zmienisz rozmiarokna się i wychodzą, zachowuje się dokładnie tak, jak chcę. (zwróć uwagę, jak druga kreska po prawej stronie pojawia się pod pierwszą kreską po lewej, gdy rozmiar ekranu zmienia się do wewnątrz).
Jeśli ustawisz dokument z powrotem na standardy IE9tryb, a następnie zmień rozmiar wewnątrz, zobaczysz, że zewnętrzny czerwony obramowany div nie respektuje jego wewnętrznej zawartości (żółtego pola).
Czy jest jakiś sposób, aby zachowywał się tak, jak w trybie dziwactwa? (Bez JavaScript)
Odpowiedzi:
0 dla odpowiedzi № 1Dzięki, znalazłem dość specyficzną kombinację css / html, która dała mi zachowanie, po którym byłem. Działa we wszystkich głównych przeglądarkach, w tym ie7 do np. 9.
Zasadniczo, w rzędzie lewych pływających elementów, jeślidajesz pierwszemu elementowi ustawienie minimalnej szerokości%, a reszcie elementów kombinację minimalnej szerokości% + szerokości% ... otrzymujesz płynny układ, który zmusza elementy do opadania pod ich rodzeństwem, gdy okno przeglądarki kurczy się.
Oto działający przykład, spróbuj zmienić rozmiar przeglądarki. http://www.nathanielkessler.com/div/cssfluid.html
0 dla odpowiedzi nr 2
Myślę, że chcesz min-width Atrybut CSS. Zestaw .item { min-width: 200px; }