Hej
Chciałbym, aby pola checkbox na wydruku wyglądaby bardziej "wydrukowo", tzn.
żeby zamiast kwadracika z zielonym ptaszkiem był np. 'X' albo nawet ten
ptaszaek, ale czarny i bez kwadracika.
To niestety musi działać w Firefoksie, ale ten jakoś nie lubi stylów dla
checkboksów.
Mógłbym zrobić coś takiego, że użyłbym
td {content:'X'}
input[type=checkbox] {display:none}
ale w CSS nie można dobrać się do rodzica elementu, a nie chcę zmieniać
wszystkich td.
Jest jakieś ładne wyjście z tej sytuacji?

lamer

do góry

On 2009-08-25 12:17, lamer wrote:

> Chciałbym, aby pola checkbox na wydruku wyglądaby bardziej "wydrukowo",
> tzn. żeby zamiast kwadracika z zielonym ptaszkiem był np. 'X' albo nawet
> ten ptaszaek, ale czarny i bez kwadracika.


<style media="print">
label{
display: block;
}

input[type='checkbox']+label:before,
input[type='checkbox']:indeterminate+label:before{
content:"\2610";
}

input[type='checkbox']:checked+label:before{
content:"\2612";
}

input[type='checkbox']{
display: none;
}
</style>


<input name="" type="checkbox" value="" /><label>checkbox</label>
<input name="" type="checkbox" value="" /><label>checkbox</label>
<input name="" type="checkbox" value="" /><label>checkbox</label>


Ale - to głupie : )

do góry

On Tue, 25 Aug 2009 12:50:25 +0100, satellite <p...@g...pl> wrote:

> input[type='checkbox']:checked+label:before{
> content:"\2612";
> }
>
> input[type='checkbox']{
> display: none;
> }
> </style>
>
>
> <input name="" type="checkbox" value="" /><label>checkbox</label>
> <input name="" type="checkbox" value="" /><label>checkbox</label>
> <input name="" type="checkbox" value="" /><label>checkbox</label>
>
>
> Ale - to głupie : )

Ano:

1. ::before i ::after są wewnątrz elementu, więc display:none na elemencie
je usunie
2. elementy formularza to "replaced elements", które nie mają
pseudo-elementów before/after


Takie coś:

input[type=checkbox] {content: "[ ]";}
input[type=checkbox]:checked {content: "[X]"}

ma szansę zadziałać w Operze/Safari 4 (nie testowałem).

W praktyce nie objedzie się bez JS synchronizującego checkboksa z <img>.

--
http://pornel.net
this.author = new Geek("porneL");

do góry

porneL pisze:
> On Tue, 25 Aug 2009 12:50:25 +0100, satellite <p...@g...pl> wrote:
>
>> input[type='checkbox']:checked+label:before{
>> content:"\2612";
>> }
>>
>> input[type='checkbox']{
>> display: none;
>> }
>
> Ano:
>
> 1. ::before i ::after są wewnątrz elementu, więc display:none na
> elemencie je usunie
> 2. elementy formularza to "replaced elements", które nie mają
> pseudo-elementów before/after

satellite ustawia ::before i ::after dla labela, nie dla inputa.


--
message[autor="PablO"]::after {
content:"Pozdrawiam";
}

do góry

Użytkownik "satellite" <p...@g...pl> napisał w wiadomości
news:h70j5v$phe$1@inews.gazeta.pl...
> On 2009-08-25 12:17, lamer wrote:
>
>> Chciałbym, aby pola checkbox na wydruku wyglądaby bardziej "wydrukowo",
>> tzn. żeby zamiast kwadracika z zielonym ptaszkiem był np. 'X' albo nawet
>> ten ptaszaek, ale czarny i bez kwadracika.
>
>
> <style media="print">
> label{
> display: block;
> }
>
> input[type='checkbox']+label:before,
> input[type='checkbox']:indeterminate+label:before{
> content:"\2610";
> }
>
> input[type='checkbox']:checked+label:before{
> content:"\2612";
> }
>
> input[type='checkbox']{
> display: none;
> }
> </style>
>
>
> <input name="" type="checkbox" value="" /><label>checkbox</label>
> <input name="" type="checkbox" value="" /><label>checkbox</label>
> <input name="" type="checkbox" value="" /><label>checkbox</label>
>
>
> Ale - to głupie : )

Przepraszam, że tak późno odpisuję, nie miałem czasu na dany projekt.
Pomysł jest całkiem ciekawy, chyba z niego skorzystam, dzięki!

lamer

do góry