Witam, mam pytanie jak wyśrodkować wszystkie informacje włącznie z avatarem przy postach użytkowników?
http://desmond.imageshack.us/Himg515...png&res=medium
Wersja do druku
Witam, mam pytanie jak wyśrodkować wszystkie informacje włącznie z avatarem przy postach użytkowników?
http://desmond.imageshack.us/Himg515...png&res=medium
Wchodzimy Style i szablony - Zarządzaj szablonami - Edytuj Szablon - CSS Templates - postbit.css i na końcu dodajesz
.postbitlegacy .userinfo .postuseravatar, .postbitlegacy .userinfo .postuseravatar img {float:none; text-align:center;}
Sam się dziwie, po dopisaniu brak efektów..
Zakończenie postbitu wygląda tak jak poniżej
Cytat:
</vb:if>
</vb:if>
</span>
</div>
</div>
<div class="clear"></div>
</div>
<div class="vbcat_bottom"><div class="vbcat_bottom_left"><div class="vbcat_bottom_right"></div></div></div>
<hr />
</li>
{vb:raw template_hook.postbit_end}
.postbitlegacy .userinfo .postuseravatar, .postbitlegacy .userinfo .postuseravatar img {float:none; text-align:center;}
Kolego wstawiasz to do postbit.css nie postbit_legacy
Sam się dziwie, po dopisaniu brak efektów..
Zakończenie postbitu wygląda tak jak poniżej
look..Cytat:
</vb:if>
</vb:if>
</span>
</div>
</div>
<div class="clear"></div>
</div>
<div class="vbcat_bottom"><div class="vbcat_bottom_left"><div class="vbcat_bottom_right"></div></div></div>
<hr />
</li>
{vb:raw template_hook.postbit_end}
.postbitlegacy .userinfo .postuseravatar, .postbitlegacy .userinfo .postuseravatar img {float:none; text-align:center;}
http://s5.ifotos.pl/img/gfyjhPNG_rnernph.PNG
Pisałem Ci wyżej wstaw do postbit.css nie w postbit
W CSS rozwijasz i masz postbit.css
Bez rezultatu, tak jak po wstawieniu do postbit...
http://s4.ifotos.pl/img/erwPNG_rnernwp.PNG
Nie będzie działać zwróć uwagę że masz w swoim stylu identyczne pozycję kilka linii wyżej a tam wyrównane do lewej. Trzy pozycje wyżej edytuj z left na center.
Nie działa
Cytat:
.postbody img.inlineimg {
vertical-align: bottom;
}
.postbody .lastedited .reason {
font-weight: bold;
}
.postbitlegacy .userinfo .userinfo_extra {
width:{vb:math {vb:stylevar postbitlegacy_userinfo_width}-{vb:math {vb:stylevar padding}*2}};
float: {vb:stylevar center};
font-size: {vb:stylevar small_fontSize};
}
.hasad {
display:block;
margin-{vb:stylevar right}: {vb:stylevar ad_post_maxWidth};
}
.postbit .posttitle, .postbitlegacy .title
{
/* border-bottom: {vb:stylevar postbittitle_border};
padding-bottom: 5px;*/
margin-bottom: 5px;
}
.postbitlegacy .userinfo .postuseravatar, .postbitlegacy .userinfo .postuseravatar img {float:none; text-align:center;}
Zazwyczaj działa.
Spróbuj w additional.css dodac na końcu:
Kod:.postbitlegacy .userinfo .postuseravatar, .eventbit .userinfo .eventuseravatar {
float:none !important;
text-align:center !important;
}
.postbitlegacy .userinfo .username_container, .postbit_reputation, .postbitlegacy .userinfo .rank, .postbitlegacy .userinfo .usertitle {
text-align:center !important;
}
Co do wczesniejszego rozwiązania dodaj również do postbit-ie.css jezeli korzystasz z przeglądarki IE.
Wyśrodkowało tytuł użytkownika, jego rangę graficzną - a reszta nie uległa wyśrodkowaniu.
Wstaw swój postbit lub postbit_legacy, oraz postbit.css i additional.css
additional.css Wklej.to - po prostu wklej to! - paste: RCQzH
postbit.css Wklej.to - po prostu wklej to! - paste: nMF0l
postbit_legacy Wklej.to - po prostu wklej to! - paste: RrErB
w postbit.css:
Możesz próbować wymusić wyśrodkowanie w postbit_legacy np. dla avataru zamiastKod:.postbitlegacy .userinfo .postuseravatar, .eventbit .userinfo .eventuseravatar {
display:block;
margin:{vb:math {vb:stylevar padding}/3} auto 0;
text-align:{vb:stylevar left};
width: auto;
float: {vb:stylevar left}; ///// tu zmień na wyśrodkowanie
clear: both;
Kod:<a class="postuseravatar" href="{vb:link member, {vb:raw post}}" title="{vb:rawphrase {vb:raw post['onlinestatusphrase']}, {vb:raw post.username}}"> </a>
<img src="{vb:raw post.avatarurl}" alt=" {vb:rawphrase xs_avatar, {vb:raw post.username}}" title="{vb:rawphrase xs_avatar <, {vb:raw post.username}}" />
<br>
daj:
Ale jest to rozwiązanie mało profesjonalne.Kod:<center> <a class="postuseravatar" href="{vb:link member, {vb:raw post}}" title="{vb:rawphrase {vb:raw post['onlinestatusphrase']}, {vb:raw post.username}}"> </a>
<img src="{vb:raw post.avatarurl}" alt=" {vb:rawphrase xs_avatar, {vb:raw post.username}}" title="{vb:rawphrase xs_avatar <, {vb:raw post.username}}" />
<br></center>
Na końcu postbit.css daj:
Kod:.postbitlegacy .userinfo .postuseravatar, .eventbit .userinfo .eventuseravatar .postuseravatar img {float:none; text-align:center;}
.postbitlegacy .userinfo .postuseravatar, .eventbit .userinfo .eventuseravatar {
float:none !important;
text-align:center !important;
}
.postbitlegacy .userinfo .username_container, .postbit_reputation, .postbitlegacy .userinfo .rank, .postbitlegacy .userinfo .usertitle {
text-align:center !important;
}
Został wyśrodkowany jedynie avatar.
Postbit.css Wklej.to - po prostu wklej to! - paste: OLMs4
Legacy: Wklej.to - po prostu wklej to! - paste: gZFoX
Ok czyli zadziałało wymuszone wyśrodkowane, niby półprofesjonalne ale niech będzie skoro działa.
Daj screenie jak to teraz wygląda oraz podaj co jeszcze potrzebujesz wyśrodkować.
http://s4.ifotos.pl/img/ssxerrxPN_rneehra.PNG
Grupe, dołączył, posty, siłę reputacji, gg.
---------- Post added at 16:14 ---------- Previous post was at 16:09 ----------
http://s4.ifotos.pl/img/ssxerrxPN_rneehra.PNG
Grupe, dołączył, posty, siłę reputacji.
PS: z gadu gadu już sobie poradziłem
1 możliwość:
w postbit.css wyśrodkuj elementy
Kod:.postbit .userinfo_extra dl dt {
float:{vb:stylevar left};
display:block;
margin-{vb:stylevar right}: {vb:math {vb:stylevar padding}/2};
}
-----------------------------------
.postbitlegacy dl.userinfo_extra, .postbitlegacy dl.user_rep {
margin: {vb:math {vb:stylevar padding}/2} 0;
display:block;
float: {vb:stylevar left};
width: {vb:math {vb:stylevar postbitlegacy_userinfo_width}-{vb:math {vb:stylevar padding}*2}};
}
------------------------------------------
.postbitlegacy dl.userinfo_extra dt, .postbitlegacy dl.user_rep dt {
float: {vb:stylevar left};
text-align: {vb:stylevar left};
/*color: {vb:stylevar shade_color};*/
margin-{vb:stylevar right}: {vb:stylevar padding};
margin-{vb:stylevar left}: 0;
min-width:60px;
width:auto !important;
width:60px;
}
Ewentualnie w postbit:
zmień:
na:Kod:<dl class="userinfo_extra">
<vb:if condition="$post['joindate']"><div class="pbit">{vb:rawphrase join_date}: <span style="color:#88aace">{vb:raw post.joindate}</span></div></vb:if>
<vb:if condition="$post['field2']"><div class="pbit">{vb:rawphrase location_perm}: <span style="color:#88aace">{vb:raw post.field2}</span></div></vb:if>
<vb:if condition="$post['age']"><div class="pbit">{vb:rawphrase age}: <span style="color:#88aace">{vb:raw post.age}</span></div></vb:if>
<div class="pbit">{vb:rawphrase 'posts'}: <span style="color:#88aace">{vb:raw post.posts}</span></div>
<div class="pbit"><vb:if condition="$show['reputation']">
<vb:if condition="$show['reppower']">
<dt>{vb:rawphrase reppower}</dt>
<dd id="reppower_{vb:raw post.postid}_{vb:raw post.userid}">{vb:raw post.reppower}</dd>
</vb:if> </div>
</vb:if>
{vb:raw template_hook.postbit_userinfo_right_after_posts}
</dl>
Kod:<dl class="userinfo_extra">
<center>
<vb:if condition="$post['joindate']"><div class="pbit">{vb:rawphrase join_date}: <span style="color:#88aace">{vb:raw post.joindate}</span></div></vb:if>
<vb:if condition="$post['field2']"><div class="pbit">{vb:rawphrase location_perm}: <span style="color:#88aace">{vb:raw post.field2}</span></div></vb:if>
<vb:if condition="$post['age']"><div class="pbit">{vb:rawphrase age}: <span style="color:#88aace">{vb:raw post.age}</span></div></vb:if>
<div class="pbit">{vb:rawphrase 'posts'}: <span style="color:#88aace">{vb:raw post.posts}</span></div>
<div class="pbit"><vb:if condition="$show['reputation']">
<vb:if condition="$show['reppower']">
<dt>{vb:rawphrase reppower}</dt>
<dd id="reppower_{vb:raw post.postid}_{vb:raw post.userid}">{vb:raw post.reppower}</dd>
</vb:if> </div>
</vb:if>
{vb:raw template_hook.postbit_userinfo_right_after_posts}</center>
</dl>
Powyższa konfiguracja w postbit.css nie skutkuje, w postbit nie posiadam nawet wyrażenia:Kod php:
<center>
.postbitlegacy .userinfo .guest.username, .eventbit .userinfo .guest.username {
padding-top: {vb:math {vb:stylevar padding}/2};
display:block;
font-size: {vb:stylevar font.fontSize}{vb:stylevar font.units};
}
.postbitlegacy dl.userinfo_extra, .postbitlegacy dl.user_rep {
margin: {vb:math {vb:stylevar padding}/2} 0;
display:block;
float: {vb:stylevar left};
width: {vb:math {vb:stylevar postbitlegacy_userinfo_width}-{vb:math {vb:stylevar padding}*2}};
}
.postbitlegacy dl.userinfo_extra dt, .postbitlegacy dl.user_rep dt {
float: {vb:stylevar left};
text-align: {vb:stylevar left};
/*color: {vb:stylevar shade_color};*/
margin-{vb:stylevar right}: {vb:stylevar padding};
margin-{vb:stylevar center}: 0;
min-width:60px;
width:auto !important;
width:60px;
</center>
}
http://wklej.to/hoQqMCytat:
<dl class="userinfo_extra">
W postbit.css który mi wcześniej podałeś: Wklej.to - po prostu wklej to! - paste: OLMs4 jak najbardziej elementy podane przeze mnie istnieją. Są one blisko siebie i nie chodziło mi o wyśrodkowanie po przez taki sposób jak napisałeś tylko zmianę left na center w odpowiednich liniach które podałem. Np.
naKod:float: {vb:stylevar left};
lub przykład:Kod:float: {vb:stylevar center};
naKod:text-align: {vb:stylevar left};
A co do możliwości numer dwa moje niedomówienie chodzi o postbit_legacy nie zwykły postbit.Kod:text-align: {vb:stylevar center};
Załącznik 1064
Siła reputacji jeszcze coś nie tak
Siła reputacji to chyba się nie zmieściła i ją przeniosło niżej.
Ogólnie ten kod odpowiada za reputację w tym miejscu:
Spróbuj dać to w inny miejsce np nad ikonką reputacji czyli nad:Kod:<div class="pbit"><vb:if condition="$show['reputation']">
<vb:if condition="$show['reppower']">
<dt>{vb:rawphrase reppower}</dt>
<dd id="reppower_{vb:raw post.postid}_{vb:raw post.userid}">{vb:raw post.reppower}</dd>
</vb:if> </div>
</vb:if>
Ewentualnie zmień kod:Kod:<vb:if condition="$post['rank']">
<span class="rank">{vb:raw post.rank}</span>
</vb:if>
na:Kod:<div class="pbit"><vb:if condition="$show['reputation']">
<vb:if condition="$show['reppower']">
<dt>{vb:rawphrase reppower}</dt>
<dd id="reppower_{vb:raw post.postid}_{vb:raw post.userid}">{vb:raw post.reppower}</dd>
</vb:if> </div>
</vb:if>
Kod:<vb:if condition="$show['reputation']">
<vb:if condition="$show['reppower']"><dt>{vb:rawphrase reppower}</dt>
<dd id="reppower_{vb:raw post.postid}_{vb:raw post.userid}">{vb:raw post.reppower}</dd>
</vb:if>
</vb:if>
Zmiana kodu / miejsca nic nie pomogła - w takim razie gdzie mogę z edytować tekst "Siła reputacji" na krótszy?
Oraz jeszcze muszę wyśrodkować "Ostrzeżenia 0/1 (1) " , który kod za nie odpowiada?
Kod odpowiadający za ostrzeżenia w postbit_legacy:
Kod:<dl class="user_rep">
<div class="pbit"><vb:if condition="$show['infraction']">
<dt>{vb:rawphrase infractions}</dt>
<dd>{vb:raw post.warnings}/{vb:raw post.infractions} ({vb:raw post.ipoints})</dd>
</vb:if></div>
</dl>
Zmiana słowa Siła reputacji na inne:
PA-Języki-Szukaj we frazach, podajesz Siła Reputacji i edytujesz: reppower
Dziwne, zmiana treści na bardzo małą nic nie pomogła.
http://s5.ifotos.pl/img/rtyrtrPNG_rneewxn.PNG
Legacy Wklej.to - po prostu wklej to! - paste: aVIgQ
Wstaw jeszcze zamiast:
Taki kod:Kod:<div class="pbit"><vb:if condition="$show['reputation']">
<vb:if condition="$show['reppower']">
<dt>{vb:rawphrase reppower}</dt>
<dd id="reppower_{vb:raw post.postid}_{vb:raw post.userid}">{vb:raw post.reppower}</dd>
</vb:if> </div>
</vb:if>
W postbit_legacyKod:<vb:if condition="$show['infraction'] OR $show['reppower']">
<dl class="user_rep">
<vb:if condition="$show['reputation']">
<vb:if condition="$show['reppower']">
<dt>{vb:rawphrase reppower}</dt>
<dd id="reppower_{vb:raw post.postid}_{vb:raw post.userid}">{vb:raw post.reppower}</dd>
</vb:if>
</vb:if>
</dl>
</vb:if>
Nic nie pomogło
Zamiast:
Wstaw:Kod:<div class="pbit"><vb:if condition="$show['reputation']">
<vb:if condition="$show['reppower']">
<dt>{vb:rawphrase reppower}</dt>
<dd id="reppower_{vb:raw post.postid}_{vb:raw post.userid}">{vb:raw post.reppower}</dd>
</vb:if> </div>
</vb:if>
Kod:<div class="pbit"><vb:if condition="$show['reputation']">
<vb:if condition="$show['reppower']">
<dt>{vb:rawphrase reppower}</dt>{vb:raw post.reppower}
</vb:if> </div>
</vb:if>
Kompletnie nie wiem czemu tak u Ciebie przenosi do nowej linii, nawet po wstawieniu kodu z domyślnego stylu. Wykonaj to co napisałem i będziemy dalej myśleć.
Załącznik 1065
Bez zmian, jedynie kolor liczby reputacji zmienił się na szary.
http://wklej.to/xKnqz
Ostatnie podejście jak nie działa to już nie mam póki co pomysłu:
Zmień:
na:Kod:<div class="pbit"><vb:if condition="$show['reputation']">
<vb:if condition="$show['reppower']">
<dt>{vb:rawphrase reppower}</dt>
<dd id="reppower_{vb:raw post.postid}_{vb:raw post.userid}">{vb:raw post.reppower}</dd>
</vb:if> </div>
</vb:if>
Kod:<div class="pbit"><vb:if condition="$show['reputation']">
<vb:if condition="$show['reppower']">
<dd>{vb:rawphrase reppower}: {vb:raw post.reppower}</dd>
</vb:if> </div>
</vb:if>
Już jest w jednej linii, tylko rozmieszczenie i kolor czcionki nie jest poprawny. To samo chciałbym zrobić z Ostrzeżeniami.Załącznik 1068
Co do ostrzeżeń zmień:
na:Kod:<dl class="user_rep">
<div class="pbit"><vb:if condition="$show['infraction']">
<dt>{vb:rawphrase infractions}</dt>
<dd>{vb:raw post.warnings}/{vb:raw post.infractions} ({vb:raw post.ipoints})</dd>
</vb:if></div>
</dl>
Kod:<dl class="user_rep">
<div class="pbit"><vb:if condition="$show['infraction']">
<dd>{vb:rawphrase infractions}: {vb:raw post.warnings}/{vb:raw post.infractions} ({vb:raw post.ipoints})</dd>
</vb:if></div>
</dl>
Załącznik 1073
Jeszcze kolory i rozmieszczenie Reputacji.
Wklej.to - po prostu wklej to! - paste: tFtmB
to jest trochę problem, gdyż podstawowe ustawienia tak jak wcześniej widziałeś robię sobie linię odstępu, ja proponuję dać ostrzeżenia i reputację pod wszystkim co jest dobrze czyli posty, dołączył i mieszka. Dlatego też kod:
Kod:<vb:if condition="$show['infraction'] OR $show['reppower']">
<dl class="user_rep">
<div class="pbit"><vb:if condition="$show['reputation']">
<vb:if condition="$show['reppower']">
<dd>{vb:rawphrase reppower}: {vb:raw post.reppower}</dd>
</vb:if> </div>
</vb:if>
</dl>
</vb:if>
Przenieś pod lub nad:
Kod:<vb:if condition="$show['infraction'] OR $show['reppower']">
<dl class="user_rep">
<div class="pbit"><vb:if condition="$show['infraction']">
<dd>{vb:rawphrase infractions}: {vb:raw post.warnings}/{vb:raw post.infractions} ({vb:raw post.ipoints})</dd>
</vb:if></div>
</dl>
</vb:if>
Działa, jeszcze brakuje standardowych kolorów Załącznik 1074
Tak ja kwczesniej pisałem ciężko będzie je uzyskać odpowiednie sekcje nie działają jak powinny możesz ręcznie to narzucić dla przykładu reputacja:
i ostrzeżenia:Kod:<vb:if condition="$show['infraction'] OR $show['reppower']">
<dl class="user_rep">
<div class="pbit"><vb:if condition="$show['reputation']">
<vb:if condition="$show['reppower']">
<dd><font color="white">{vb:rawphrase reppower}:</font> {vb:raw post.reppower}</dd>
</vb:if> </div>
</vb:if>
</dl>
</vb:if>
Kod:<vb:if condition="$show['infraction'] OR $show['reppower']">
<dl class="user_rep">
<div class="pbit"><vb:if condition="$show['infraction']">
<dd><font color="white">{vb:rawphrase infractions}: </font>{vb:raw post.warnings}/{vb:raw post.infractions} ({vb:raw post.ipoints})</dd>
</vb:if></div>
</dl>
</vb:if>
Jeszcze pytanie, jak się nazywa kolor tej czcionki co ma napis "Posty" lub który to z palety, ponieważ biały nie pasuje do reszty.
Zamiast white które podałem wstaw #8f8f8f powinno pasować.
Ręcznie narzucone ale działa jak powinno :p
Dzięki za pomoc, można zamknąć ten obszerny temat.
Ten problem został rozwiązany, a wątek zamknięty.
- Jeśli chcesz zadać nowe pytanie, załóż nowy wątek.
- Jeśli masz wątpliwości odnośnie rozwiązanego problemu, poproś moderatora o otworzenie wątku.