Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> Pionowe wyrównanie tekstu, w elemencie input ( value )
pojas
post
Post #1





Grupa: Zarejestrowani
Postów: 53
Pomógł: 0
Dołączył: 31.03.2006

Ostrzeżenie: (0%)
-----

W jaki sposób ustawić pionowe wyrównanie tekstu w elemencie input?
Te zrzuty ekranów powinny wyjaśnić o co mi chodzi (chcę np. ustawić, żeby w każdej przeglądarce było jak w Operze)


Kod
[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3.     <style type="text/css">
  4.  
  5.         * {
  6.             margin: 0;
  7.             padding: 0;
  8.  
  9.             font-family: Verdana;
  10.             font-size: 11px;
  11.             color: #555555;
  12.         }
  13.  
  14.         body {
  15.             text-align: center;
  16.  
  17.             margin-top: 100px;
  18.         }
  19.  
  20.  
  21.  
  22.  
  23.         input {
  24.             width: 300px;
  25.             height: 150px;
  26.  
  27.             border: 1px solid #999999;
  28.  
  29.             text-align: center;
  30.             vertical-align: middle;
  31.         }
  32.  
  33.     </style>
  34. </head>
  35. <body>
  36.  
  37.     <form>
  38.         Ala ma <input value="psa"> a pies ma smycz.
  39.     </form>
  40.  
  41. </body>
  42. </html>
[HTML] pobierz, plaintext


Z góry dzięki.
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi (1 - 5)
nevt
post
Post #2





Grupa: Przyjaciele php.pl
Postów: 1 595
Pomógł: 282
Dołączył: 24.09.2007
Skąd: Reda, Pomorskie.

Ostrzeżenie: (0%)
-----

zamiast vertical-align
Kod
input
{
     ...
     line-height: ...;
     padding-top: ...;
}

i będzie ok w większości przeglądarek.
Go to the top of the page
+Quote Post
pojas
post
Post #3





Grupa: Zarejestrowani
Postów: 53
Pomógł: 0
Dołączył: 31.03.2006

Ostrzeżenie: (0%)
-----

Kod
input
{
    /*  ...  */

    line-height: 10px;
    padding-top: 10px;

    /*  ...  */
}


W Operze jest inaczej niż w IE i FF - tekst jest obniżony o 10px od lini środka wysokości całego pola ( w IE i FF jest 10px od samej góry chyba liczone ). Jak to załatwić (IMG:http://forum.php.pl/style_emoticons/default/aarambo.gif) ?

Ten post edytował pojas 21.10.2007, 18:29:59
Go to the top of the page
+Quote Post
.radex
post
Post #4





Grupa: Zarejestrowani
Postów: 1 657
Pomógł: 125
Dołączył: 29.04.2006

Ostrzeżenie: (0%)
-----

w operze najlepszy jest sposób przedstawiony przez ciebie...
Go to the top of the page
+Quote Post
pojas
post
Post #5





Grupa: Zarejestrowani
Postów: 53
Pomógł: 0
Dołączył: 31.03.2006

Ostrzeżenie: (0%)
-----

Czyli jak powinny wyglądać style? (działające wszędzie?) Chcę, żeby tekst był na środku całej wysokości.

Ten post edytował pojas 21.10.2007, 20:42:45
Go to the top of the page
+Quote Post
.radex
post
Post #6





Grupa: Zarejestrowani
Postów: 1 657
Pomógł: 125
Dołączył: 29.04.2006

Ostrzeżenie: (0%)
-----

raczej tak(na oko):

input
{
/* ... */

/* IE, FF itp. */
line-height: 10px;
padding-top: 10px;
/* Opera itp. */
vertical-align: middle;

/* ... */
}
Go to the top of the page
+Quote Post
« Następny starszy · Po stronie przeglądarki · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 24.08.2025 - 14:37
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn