Pozycja tekstu w banerze (wyśrodkowanie)

[macasm]

[michalszyd]

Jak chcesz paddingiem, to możesz ustawić dolny margines

Kod:

padding-bottom: 10px; /* 10 oczywiście zmieniasz według uzania */

Ale lepszym sposobem jest dodanie do CSS (bannerRight)

Kod:

vertical-align: center;

[macasm]

Niestety, żaden z tych sposobów nie działa. Margines dolny jest już ustawiony domyślnie na 10px, jak zmieniam na więcej to zwiększa się jedynie przestrzeń między banerem a polem poniżej. Nie ma żadnych zmian wewnątrz banera. Przy "vertical-align" cały baner zmniejsza się praktycznie o połowę, tekst jest na środku ale tylko dlatego, że baner jest zmniejszony.

Czy jest możliwe, że przy tworzeniu grafiki (wąskiego paska, który został powielony w poziomie) w jakiś sposób została tam zaznaczona jakaś "granica", która nie pozwala umieścić tego tekstu pośrodku banera?

[thdsgn]

Niestety, żaden z tych sposobów nie działa. Margines dolny jest już ustawiony domyślnie na 10px, jak zmieniam na więcej to zwiększa się jedynie przestrzeń między banerem a polem poniżej. Nie ma żadnych zmian wewnątrz banera. Przy "vertical-align" cały baner zmniejsza się praktycznie o połowę, tekst jest na środku ale tylko dlatego, że baner jest zmniejszony.

Czy jest możliwe, że przy tworzeniu grafiki (wąskiego paska, który został powielony w poziomie) w jakiś sposób została tam zaznaczona jakaś "granica", która nie pozwala umieścić tego tekstu pośrodku banera?

Kod:

padding:50px 0 0 10px
        |
        | zmień na
        |
        \/
padding:50px 0 10px 10px;

Z innej beczki:
do tego jest błąd w tym miejscu:

Kod:

border:1px solid #CCC;
border-width:1px 0 0 1px;

tutaj masz 2 cechy dla bordera. Nie rozumiem dlaczego najpierw jest ustawiana szerokość każdego obramowania a później dla poszczególnych zmieniana? Pamiętaj aby trzymać się pewnej konwencji. Albo stosujesz cechę mieszaną albo pojedynczą.

[macasm]

[michalszyd]

Jak byś pokazał kod odpowiedzialny za wyświetlenie banneru i tekstu byłoby o wiele łatwiej.

Spróbuj dać tekst z bannera (lewy banner) w osobny div, któremu nadasz w stylach margin-bottom: 10px;

Bez podglądu kodu nie wiem jak jeszcze można pomóc.

[macasm]

Kod odpowiedzialny za tekst w lewym banerze (h1-główny tekst-nazwa, h2-drugi tekst, mniejszy)

Kod:

h1 {
    font-size:27px;
    color:#f1b661;
    font-weight:700;
    margin:0;
    line-height:30px;
}
h2 {
    font-size:12px;
    color:#F90;
    margin:0;
    font-weight:700;
}

Line-height dodałem sam i tym samym zwiększyłem odległość między oboma tekstami.

Kod banera:

Kod:

#bannerRight {
    width:529px;
    height:49px;
    background:url(bg1c.gif) repeat-x;
    float:left;
    border:1px solid #CCC;
    border-width:1px 0 0 1px;
    padding:50px 0 0 10px;

Tekst w banerze wpisuję między

Kod:

<div id="bannerRight"> </div>

W lewym banerze znajduje się zdjęcie, nie ma tam żadnego tekstu.

[michalszyd]

Kod odpowiedzialny za tekst w lewym banerze

W lewym banerze znajduje się zdjęcie, nie ma tam żadnego tekstu.

Hmmm..

Ciekawy kod:

Kod:

height:49px;

Kod:

padding:50px 0 0 10px;

Cały div ma wysokość 49px, a ustawiasz margines górny na 50 px. Oczywiste że pójdzie na sam dół.

Kod:

#bannerRight {
     width:529px;
     height:49px;
     background:url(bg1c.gif) repeat-x;
     float:left;
     border:1px solid #CCC;
     border-width:1px 0 0 1px;
     vertical-align: center;

Powinno działać. A jak nie to zmniejsz padding

Kod:

padding:50px 0 0 10px;

na

Kod:

padding-top: 25px; /*dopasuj 1 wartość wedle uznania */

[macasm]

Nadal nie działa. Zamiast zmieniać pozycję tekstu, zmniejsza albo zwiększa cały baner.

W każdym razie dzięki za pomysły, zostawię to tak jak jest bo już nie mam do tego siły.

[michalszyd]

A powiedz jeszcze jaką wysokość w px ma ten banner? tylko nie podawaj z pliku, tylko w rzeczywistości jak przeglądarka go pokazuje.

Być może pomoże zmniejszenie wysokości bannera

Kod:

height: 0px;

i dodanie dolnego marginesu

Kod:

padding:50px 0 0 50px;

Albo zwiększyć wielkość banneru

Kod:

height: 100px;

i usunąć paddingi a w zamian dać

Kod:

vertical-align: center;