Witam

Chciałbym uzyskać taki efekt jak na tej grafice

http://nas-wd.deviantart.com/art/NEIMS-112618827

Chodzi mi o wygląd pola tekstowego z napisem "Enter email address here"

Podpowie ktoś, jak zrobić by ten button był nałożony na to pole? :)

Dzięki i pozdrawiam
Mariusz

do góry

Mariusz "Vizu" Wiloch pisze:
> Chciałbym uzyskać taki efekt jak na tej grafice
>
> http://nas-wd.deviantart.com/art/NEIMS-112618827

Piękny projekt.

> Chodzi mi o wygląd pola tekstowego z napisem "Enter email address here"
>
> Podpowie ktoś, jak zrobić by ten button był nałożony na to pole? :)

Tło dajesz nie dla inputa, ale dla jakiegoś wspólnego przodka buttona i
inputa, np. dla forma.


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

do góry

Paweł Piskorz pisze:
> Mariusz "Vizu" Wiloch pisze:
>> Chciałbym uzyskać taki efekt jak na tej grafice
>>
>> http://nas-wd.deviantart.com/art/NEIMS-112618827
>
> Piękny projekt.
>
tez mi sie bardzo podoba :)

>> Chodzi mi o wygląd pola tekstowego z napisem "Enter email address here"
>>
>> Podpowie ktoś, jak zrobić by ten button był nałożony na to pole? :)
>
> Tło dajesz nie dla inputa, ale dla jakiegoś wspólnego przodka buttona i
> inputa, np. dla forma.
>
Dzięki, faktycznie powinno zadziałac, że też na to nie wpadłem :-)

do góry

Mariusz "Vizu" Wiloch pisze:
> Paweł Piskorz pisze:
>> Mariusz "Vizu" Wiloch pisze:
>>> Chciałbym uzyskać taki efekt jak na tej grafice
>>>
>>> http://nas-wd.deviantart.com/art/NEIMS-112618827
>>
>> Piękny projekt.
>>
> tez mi sie bardzo podoba :)
>
>>> Chodzi mi o wygląd pola tekstowego z napisem "Enter email address here"
>>>
>>> Podpowie ktoś, jak zrobić by ten button był nałożony na to pole? :)
>>
>> Tło dajesz nie dla inputa, ale dla jakiegoś wspólnego przodka buttona i
>> inputa, np. dla forma.
>>
> Dzięki, faktycznie powinno zadziałac, że też na to nie wpadłem :-)
>

....
<span class="input_background"><input type="text" value="wpisz mail..."
/></span>
<input type="image" src=".." alt="send" />

Usuwasz formatowanie input, span nadajesz odpowiedni styl z background
ale nie z całym input 3/4 buttona - tylko pole (bez guzika), dajesz
float: left, wycinasz guzik i ustawiasz jako input type="image" z float:
left;
Aby tekst wewnątrz input był wyśrodkowany w operze i chrome, musisz
ustawić padding top i bottom.

Jeżeli chcesz aby działało poprawnie w ie6/7 , musisz wyciąć
powtarzający się obszar ze środka pola i ustawić dla input aby powtarzał
się poziomo.

To tyle ;)

do góry