| Autor | Zpráva | ||
|---|---|---|---|
| vecerapl Profil |
#1 · Zasláno: 1. 3. 2011, 23:50:09 · Upravil/a: vecerapl
Potřebuji mít label s textem a pod tím checkbox a vedle text. Jak tohle udělat přes CSS?
Checkbox dostanu pod label, ale text, který je vedle checkboxu mě leze pod něj. Na víc když kliknu na checkbox, tak jeho klikací šířka je snad i na 100px široký :( <p><label for="zvyraznit">Barevné zvýraznění</label><input type="checkbox" name="zvyraznit" id="zvyraznit" /> <span>Cena <strong>50 CZK</strong><span></p>
#content label {display: block;}
#zvyraznit {left: 80px; position: absolute;}
#zvyraznit span {margin-left: 90px;}
Testuji to zde: http://www.modelo.cz/platba/51/ Moc Vám děkuji za výpomoc, ale hraji si s tím už dost dlouho a jsem sám ve slepé uličce. |
||
| panther Profil |
#2 · Zasláno: 1. 3. 2011, 23:55:52
vecerapl:
vyházej absolutní pozicování. Udělat to jde tam, že label bude blokový, checkbox a text budou mít levý float. |
||
| vecerapl Profil |
#3 · Zasláno: 2. 3. 2011, 00:13:47
Je to na dobré cestě, jen nevím jak zrušit ten width, který se tam pro ten checkbox vytváří.
Zkoušel jsem už varianty různé, ale nic nezabralo.
#zvyraznit input.checkbox {width: 10px !important;}
#zvyraznit input {width: 10px !important;}
|
||
| panther Profil |
#4 · Zasláno: 2. 3. 2011, 00:22:58
vecerapl:
šířku tam nastavuje tahle deklarace #content.form input, stačí ji tedy přebít, třeba #content.form #zvyraznit. Osobně bych ale nestyloval inputy obecně, spíše bych ty textové se šířkou oddělil nějakou třídou.
Šířka 10px není potřeba, bude stačit width: auto.
Ke tvým příkladům: #zvyraznit input.checkbox ostyluje inputy se třídou checkbox (nikoliv atributem type se stejnou hodnotou). #zvyraznit input ostyluje všechny inputy v prvku, který má id="zvýraznit".
Nastuduj tedy rozdíl mezi #zvyraznit input a input#zvyraznit.
|
||
| joe Profil |
#5 · Zasláno: 2. 3. 2011, 00:31:53
vecerapl:
„Potřebuji mít label s textem a pod tím checkbox a vedle text. Jak tohle udělat přes CSS?“ Udělat to jde, panther už ti tu radí, tak se do toho montovat nebudu. Být tebou bych si spíš přehodnotil, proč to potřebuješ, protože to co děláš, není moc správné, protože se očekává, že kliknutím na text napravo od políčka jako je radio nebo checkbox, změníš jeho hodnotu na vybranou/zaškrtnutou, což se ve tvém případě nestane. Napsal bych spíš lépe texty: Barevné zvýraznění - nadpis [x] přeji si barevné zvýraznění; cena 40 CZK |
||
| vecerapl Profil |
#6 · Zasláno: 2. 3. 2011, 00:39:07
Už jsem to s panther vyřešil. Díky moc.
Jen bych měl ještě jeden dotaz. Pokud vedle check boxu přidám obrázek a vedle obrázku budu chtět zobrazit text, jak tohle všechno na jednom řádku hezky zarovnám na výšku? |
||
| __construct Profil |
#7 · Zasláno: 2. 3. 2011, 10:12:09
vecerapl:
„Pokud vedle check boxu přidám obrázek a vedle obrázku budu chtět zobrazit text, jak tohle všechno na jednom řádku hezky zarovnám na výšku?“ Neviem či som Ťa dobre pochopil, ale pozri si vlastnosť vertical-align.
|
||
|
Časová prodleva: 13 let
|
|||
0