Seite 1 von 2
icon position
Verfasst: 11.02.2013 14:46
von Maugrim
Hallo!
Ich habe eine, wohl banale, Frage.
Und zwar:
DIe icon-contact icons (also icq, pn, msnm, etc...) haben in der css die positionsdeklaration top und left
Aber eines meiner neuen icons ist kleiner als die anderen
Das klebt nun auch "oben" anstatt mittig.
Ich habe gegoogelt und angeblich soll da center und center helfen, doch wenn ich top und left durch center und center ersetze, dann bleibt das icon noch immer oben links haften...
Kann mir vielleicht jemand helfen und sagen wie ich das Icon mittig ausrichten kann?
ich kenne mich mit css leider absolut nicht aus.
Ich habe schon in der viewtopic einfach versucht den align des img src auf absmiddle zu setzen, aber auch das hilft nicht (habe vorher auch das top left aus der css deklaration heraus genommen)
Re: icon position
Verfasst: 11.02.2013 17:33
von Crizzo
Hi,
bitte einmal einen Link zum Forum, damit wir das sehen können.
Grüße
Re: icon position
Verfasst: 12.02.2013 19:15
von Maugrim
http://www.lyrija.at/Forum/viewtopic.php?f=2&p=15#p15
user: test
pass: 12345
es geht um das skype icon
das blaue ist ein Background-Image, welches ich drunter gelegt habe. Das icon klebt aber so oben links. Ich hätte es aber gerne mittig von dem blauen kästchen...
in der css aus dem Skype Mod steht bei skype icon wie gesagt top left...aber center center hilft nicht
und wenn ich in der viewtopic zu dem img src des skype status bildchens ein align="absmiddle" dazugebe hilft das auch nicht wirklich
Re: icon position
Verfasst: 12.02.2013 19:30
von Talk19zehn
Och, was nun - Login nicht möglich... - da hat wohl wer zu oft ein falsches PW eingegeben... ?
Re: icon position
Verfasst: 12.02.2013 20:17
von Maugrim
ups... da hat sich eine 3 zuviel in das Passwort eingeschlichen
12345 ist dsa richtige
Re: icon position
Verfasst: 12.02.2013 21:58
von Crizzo
Hi,
du bindest das Skype-Icon gar nicht als Hintergrundbild ein, wie bei den anderen auch, sondern als <img>-Element. Ändere das einfach so um, damit es mit den anderen gleich aussieht und dann passt wohl auch die Darstellung.
Vergleich MSN:
Code: Alles auswählen
<li class="msnm-icon">
<a title="Allvater mit MSN kontaktieren" onclick="popup(this.href, 550, 320); return false;" href="./memberlist.php?mode=contact&action=msnm&u=2">
<span>WLM</span>
</a>
</li>
mit Skype:
Code: Alles auswählen
<li class="skype-icon">
<a onclick="popup(this.href, 843, 280); return false;" href="./memberlist.php?mode=contact&action=skype&u=2">
<img title="Allvater in Skype kontaktieren" alt="skype" style="width: 16px; height: 16px;" src="PLATZHALTER">
</a>
</li>
Grüße
Re: icon position
Verfasst: 12.02.2013 22:19
von Maugrim
ah ok.
Naja, diesen "Code" habe ich so aus dem Skype-Mod direkt übernommen.
was müsste ich denn ändern?
Weil einfach nur {L_SKYPE} reinschreiben geht ja nicht *g* (bei WLM steht {L_WLM}
da gehört sicher mehr dazu...
btw: diesen Mod hier habe ich verbaut:
https://www.phpbb.com/community/viewtop ... 5#p5525445
gibts nen besseren?
Re: icon position
Verfasst: 12.02.2013 22:21
von Crizzo
Schau einfach 1:1 bei MSN und den anderen ab. Und erstelle dann analog dazu die passende CSS-Regel und den gleichen HTML-Code, nur dass eben der Link zur Funktion und die URL zur Grafik anders ist.
Re: icon position
Verfasst: 12.02.2013 22:32
von Maugrim
Das habe ich schon für die neuen Buttons versucht (google, facebook, twitter etc) da ich bei denen auch ein RolloverBild möchte. Zur Zeit habe ich es ja mit dem Mouseon Mouseoff gelöst, was ich nicht so toll finde
wenn ich zB bei MSN schaue, dann gibt es drei Erwähnungen im Theme.
Code: Alles auswählen
.msnm-icon, .msnm-icon a { background: none top left no-repeat; }
Code: Alles auswählen
ul.profile-icons li.msnm-icon { width: {IMG_ICON_CONTACT_MSNM_WIDTH}px; height: {IMG_ICON_CONTACT_MSNM_HEIGHT}px; }
Code: Alles auswählen
.msnm-icon, .msnm-icon a { background-image: url("{IMG_ICON_CONTACT_MSNM_SRC}"); }
schreibe ich beim zweiten einfach 16x16 rein?
und beim dritten einfach den Link, wie er zZ bei mir drinnen ist?
und was schreibe ich dann in den den <span></span>
bei MSN steht ja da {L_WLM}
schreib ich dann einfach {L_SKYPE} ??
in der viewtopic sieht das msnm so aus dann
Code: Alles auswählen
<!-- IF postrow.U_MSN --><li class="msnm-icon"><a href="{postrow.U_MSN}" onclick="popup(this.href, 550, 320); return false;" title="{postrow.POST_AUTHOR} mit MSN kontaktieren"><span>{L_MSNM}</span></a></li><!-- ENDIF -->
Re: icon position
Verfasst: 12.02.2013 23:57
von Talk19zehn
Hi, hilft dir jenes Thema [HowTo] ggf. im weitesten Sinne weiter?
viewtopic.php?p=1099087#p1099087
Viele Grüße