Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [CSS]Nietypowy problem z wycentrowaniem tekstu., Jak powyżej
RoysoN
post
Post #1





Grupa: Zarejestrowani
Postów: 52
Pomógł: 0
Dołączył: 3.12.2009

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


Witam, mam problem.
Na mojej stronie tło każdego nagłówka okienka jest ograniczony do tekstu, moim celem było wycenrowanie tekstu w pionie. Ale niestety, jak wstawiam display:table-cell to co prawda centruje mi w pionie ale zato tło się "ogranicza do tekstu".

Proszę o pomoc.

http://www.royson.cba.pl
  1.  
  2. div.goraokno {
  3. background: url(bobek.jpg);
  4. height:40px;
  5. width:100%;
  6. letter-spacing:1px;
  7. text-align: center;
  8. display:table-cell;
  9. vertical-align:middle;
  10. }
  11.  

Go to the top of the page
+Quote Post
Robert1985
post
Post #2





Grupa: Zarejestrowani
Postów: 84
Pomógł: 7
Dołączył: 5.08.2009
Skąd: Tychy

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


Wyjaśnij dokładniej o co chodzi z "ogranicza od tekstu" ,bo nie potrafię sobie tego wyobrazić. I napisz o jakie napisy i okienka na tej stronie Ci chodzi ,bo trochę ich tam jest.

Dobra już wiem chodzi Ci o szerokość tych okienek z gradientem. Usuń to display cell i wstaw styl:
line-height: 40px;

Ten post edytował Robert1985 5.02.2010, 12:10:44
Go to the top of the page
+Quote Post
MWL
post
Post #3





Grupa: Zarejestrowani
Postów: 493
Pomógł: 32
Dołączył: 14.04.2008
Skąd: Lenkowski.net

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


align vertical działa jedynie na tabelach, spróbuj użyć display:table; (choć nie wiem czy to w ogóle zadziała) albo po postu dodaj odpowiednie marginy czy paddingi od góry.
Go to the top of the page
+Quote Post
RoysoN
post
Post #4





Grupa: Zarejestrowani
Postów: 52
Pomógł: 0
Dołączył: 3.12.2009

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


z paddingami juz probowalem, caly naglowek sie rozszerza. chyba bede musial z marginesami poprobowac...
Go to the top of the page
+Quote Post
Robert1985
post
Post #5





Grupa: Zarejestrowani
Postów: 84
Pomógł: 7
Dołączył: 5.08.2009
Skąd: Tychy

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


a próbowałeś z tym line-height i font-size (IMG:style_emoticons/default/questionmark.gif)

  1. div.goraokno {
  2. background: url(bobek.jpg);
  3. height:40px;
  4. width:100%;
  5. letter-spacing:1px;
  6. text-align: center;
  7. line-heigth:40px;
  8. font-size:12px;
  9. }


Spróbuj!

Ten post edytował Robert1985 5.02.2010, 13:00:15
Go to the top of the page
+Quote Post
jankes83
post
Post #6





Grupa: Zarejestrowani
Postów: 32
Pomógł: 5
Dołączył: 23.12.2009

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


Daj po prostu padding-top dajmy na to 10px i o tyle samo zmniejsz wysokość tego elementu.
Kod
  div.goraokno {
background: url(bobek.jpg);
height:27px;
width:100%;
letter-spacing:1px;
text-align: center;
line-heigth:40px;
font-size:12px;
padding-top:13px;
}



Wg. mnie nie potrzeby tworzenia dodatkowego diva. Spróbuj wkleic kod który podesłałem w poprzednim poście.

Ten post edytował jankes83 5.02.2010, 13:01:52
Go to the top of the page
+Quote Post
RoysoN
post
Post #7





Grupa: Zarejestrowani
Postów: 52
Pomógł: 0
Dołączył: 3.12.2009

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


Prądzi ;P Dzięki wielkie!
Go to the top of the page
+Quote Post

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

 



RSS Aktualny czas: 17.09.2025 - 20:29