Sorkizárt, de nem sortörő elemek
Sziasztok!
A köv. problémám akadt:
Van egy dobozom, amiben logikailag egybe tartozó elemeket szeretnék kirakni ciklussal, ezeknek az elemeknek nem szabadna törniük. A megálmodott végeredmény valami ilyesmi lenne:A termékek neve persze változó hosszúságú, mellette egy darabszám inputtal.
Jelenleg a köv css alkalmaztam:ahol a new-spices a külső doboz, a spiceblock pedig a belső inline div-ek:Az eredmény lehangoló, sem IE, sem Fox nem csinálja azt amit szeretnék. IE megcsinálja a justify-t, de alkalmazza a belső spiceblock-ra is, hiába kértem, hogy white-space: nowrap;
A Fox viszont egy blokként kezeli az egy sorba kiférő elemeket, és eldobja a justify-t, és balra rendez.
Ha beszúrok a html-be egy-t minden spiceblock után, gondolván, hogy annak mentén a fox tudja sorkizárni az elemeket, teljes káosz alakul ki mindkét böngészőben.
Van ötletetek, megoldásotok ilyen problémára. Egy sorban 2 vagy három spiceblock fér ki, szeretném, ha a böngésző döntené el, hogy hol töri a sort (persze nem a spiceblock közepén), és nem szeretném meghatározni hogy mondjuk csak két oszlopban lehetnek az elemek, mert a designer ezt kérte:-)
Köszönöm!
■ A köv. problémám akadt:
Van egy dobozom, amiben logikailag egybe tartozó elemeket szeretnék kirakni ciklussal, ezeknek az elemeknek nem szabadna törniük. A megálmodott végeredmény valami ilyesmi lenne:
--------------------------------------------------------------------------------------
I I
I 1. termék <input> 2. termék <input> 3. termék <input> I
I I
I 4. hossúnevű termék <input> 5. nagyonhosszúnevű termék <input> I
I I
---------------------------------------------------------------------------------------
Jelenleg a köv css alkalmaztam:
.new-spices {
text-align: justify;
border: 1px solid #D1824A;
background: #F2E9CA;
margin-top: 2px;
margin-right: 10px;
padding-right: 5px;
padding-left: 5px;
padding-top: 5px;
font-weight: bold;
}
.spiceblock {
display: inline;
text-align: left;
white-space: nowrap;
}
.spiceblock input {
font-size: 9px;
padding: 1px;
width: 14px;
}
<div class="new-spices">
<div class="spiceblock">
Ütvefúrós agytáp <input name="bla">
</div>
<div class="spiceblock">
Ütvefúrós agytáp <input name="bla">
</div>
<div class="spiceblock">
Ütvefúrós agytáp <input name="bla">
</div>
<div class="spiceblock">
Ütvefúrós agytáp <input name="bla">
</div>
<div class="spiceblock">
Ütvefúrós agytáp <input name="bla">
</div>
<div class="spiceblock">
Ütvefúrós agytáp <input name="bla">
</div>
</div>
A Fox viszont egy blokként kezeli az egy sorba kiférő elemeket, és eldobja a justify-t, és balra rendez.
Ha beszúrok a html-be egy
Van ötletetek, megoldásotok ilyen problémára. Egy sorban 2 vagy három spiceblock fér ki, szeretném, ha a böngésző döntené el, hogy hol töri a sort (persze nem a spiceblock közepén), és nem szeretném meghatározni hogy mondjuk csak két oszlopban lehetnek az elemek, mert a designer ezt kérte:-)
Köszönöm!
