Bilder-Position im Header

Bilder-Position im Header - Druckversion

+- MyBB.de Forum (https://www.mybb.de/forum)
+-- Forum: Anpassungen (https://www.mybb.de/forum/forum-47.html)
+--- Forum: Theme-Diskussionen (https://www.mybb.de/forum/forum-84.html)
+--- Thema: Bilder-Position im Header (/thread-29015.html)

Bilder-Position im Header - Gobee129 - 13.01.2014

Hey Leute,

Ich würde gerne ein Bild auf der rechten Seite des Header einfügen. So sieht mein header derzeit aus:

Wie das Einfügen funktioniert ist mir bekannt, den Avatar auf der linken Seite habe ich ja auch gut hinzugefügt bekommen Smile

Nun möchte ich ein Bild auf der rechten Seite einfügen, doch ich tue mich echt schwer mit den allignment Regeln und dem float, also ich habe eben rumprobiert, das klappt einfach nicht so wie ich das möchte :/ Ich schaffe es zwar die Box für das foto auf der rechten seite des headers zu erstellen, doch dann ist wiederum der text links daneben (Bounty, Buddy List, Alerts) nicht in derselben Zeile..

So stelle ich mir das vor:

Der Einfachheit halber sagen wir einfach, ich möchte die Avatar-Box von links kopieren, und sie genauso rechts im header darstellen.

Hier ist mein header-weclome_user template:

Code:
<span style="float:right;">

  <strong>Bounty:</strong><a href="{$mybb->settings['bburl']}/newpoints.php"> {$mypoints}</a></br> <a href="#" class="links" onclick="MyBB.popupWindow('{$mybb->settings['bburl']}/misc.php?action=buddypopup', 'buddyList', 350, 350);">{$lang->welcome_open_buddy_list}</a></br><myalerts_headericon> </span>

<table border="0">

  <tr>

    <td>

      <img src="{$mybb->user['avatar']}" style="border:1px solid #ADCBE7;" width="43px" height="43px" />

    </td>

    <td valign="top">

<span class="smalltext">

        {$lang->welcome_back}{$lang->welcome_pms_usage} <a href="{$mybb->settings['bburl']}/private.php">{$lang->welcome_pms}.</a>  

<br><a href="{$mybb->settings['bburl']}/usercp.php">{$lang->welcome_usercp}</a>{$modcplink}{$admincplink} &mdash; <a href="{$mybb->settings['bburl']}/member.php?action=logout&amp;logoutkey={$mybb->user['logoutkey']}">{$lang->welcome_logout}</a><br />

   <a href="{$mybb->settings['bburl']}/search.php?action=getdaily">{$lang->welcome_todaysposts}</a> <!-- UNREADPOSTS_LINK --> | <a href="{$mybb->settings['bburl']}/search.php?action=getnew">{$lang->welcome_newposts}</a> | <a href="search.php?action=finduserthreads&uid={$mybb->user['uid']}">View My Threads</a>

        </span>

    </td>

  </tr>

</table>

Wo genau muss ich jetzt welchen float und welchen table benutzen, damit das auch aufgeht? Big Grin

Vielen Dank

RE: Bilder-Position im Header - MrBrechreiz - 13.01.2014

Versuchs mal so.

Code:
<table width="100%" border="0" cellspacing="0" cellpadding="0" summary="willkommensbox">

  <tr>

    <td><img src="{$mybb->user['avatar']}" style="border:1px solid #ADCBE7;" width="43" height="43" alt="" /></td>

    <td><span class="smalltext">{$lang->welcome_back}{$lang->welcome_pms_usage} <a href="{$mybb->settings['bburl']}/private.php">{$lang->welcome_pms}</a></span><br /><span class="smalltext"><a href="{$mybb->settings['bburl']}/usercp.php">{$lang->welcome_usercp}</a>{$modcplink}{$admincplink} &mdash; <a href="{$mybb->settings['bburl']}/member.php?action=logout&amp;logoutkey={$mybb->user['logoutkey']}">{$lang->welcome_logout}</a></span><br /><span class="smalltext"><a href="{$mybb->settings['bburl']}/search.php?action=getdaily">{$lang->welcome_todaysposts}</a> <!-- UNREADPOSTS_LINK --> | <a href="{$mybb->settings['bburl']}/search.php?action=getnew">{$lang->welcome_newposts}</a> | <a href="search.php?action=finduserthreads&uid={$mybb->user['uid']}">View My Threads</a></span></td>

    <td align="right" style="padding-right:5px;"><strong>Bounty:</strong><span class="smalltext"><a href="{$mybb->settings['bburl']}/newpoints.php"> {$mypoints}</a></span><br /><span class="smalltext"><a href="#" class="links" onclick="MyBB.popupWindow('{$mybb->settings['bburl']}/misc.php?action=buddypopup', 'buddyList', 350, 350);">{$lang->welcome_open_buddy_list}</a></span><br /><myalerts_headericon></td>

    <td><img src="{$mybb->user['avatar']}" style="border:1px solid #ADCBE7;" width="43" height="43" alt="" /></td>

  </tr>

</table>

Via CSS Klassen kannst Du da noch ein wenig gestaltung betreiben Big Grin

RE: Bilder-Position im Header - Gobee129 - 13.01.2014

(13.01.2014, 05:01)MrBrechreiz schrieb: Versuchs mal so.

Code:
<table width="100%" border="0" cellspacing="0" cellpadding="0" summary="willkommensbox"> <tr> <td><img src="{$mybb->user['avatar']}" style="border:1px solid #ADCBE7;" width="43" height="43" alt="" /></td> <td>{$lang->welcome_back}{$lang->welcome_pms_usage} <a href="{$mybb->settings['bburl']}/private.php">{$lang->welcome_pms}</a> <a href="{$mybb->settings['bburl']}/usercp.php">{$lang->welcome_usercp}</a>{$modcplink}{$admincplink} — <a href="{$mybb->settings['bburl']}/member.php?action=logout&logoutkey={$mybb->user['logoutkey']}">{$lang->welcome_logout}</a> <a href="{$mybb->settings['bburl']}/search.php?action=getdaily">{$lang->welcome_todaysposts}</a>  | <a href="{$mybb->settings['bburl']}/search.php?action=getnew">{$lang->welcome_newposts}</a> | <a href="search.php?action=finduserthreads&uid={$mybb->user['uid']}">View My Threads</a></td> <td align="right" style="padding-right:5px;">Bounty:<a href="{$mybb->settings['bburl']}/newpoints.php"> {$mypoints}</a> <a href="#" class="links" onclick="MyBB.popupWindow('{$mybb->settings['bburl']}/misc.php?action=buddypopup', 'buddyList', 350, 350);">{$lang->welcome_open_buddy_list}</a> <myalerts_headericon></td> <td><img src="{$mybb->user['avatar']}" style="border:1px solid #ADCBE7;" width="43" height="43" alt="" /></td> </tr> </table>

Via CSS Klassen kannst Du da noch ein wenig gestaltung betreiben

Thank you so far. Now all the allignments work, but the postions are incorrect:

Ach ich kann hier ja Deutsch schreiben xD Also text und bild sind jetzt gut nebeneinander, jedoch ist auf beiden Seiten noch deutlich sichtbar platz. ich möchte das bild auf der rechten siete schon ganz an den rand des header bekommen, und auch links ist der platz zwischen avatar und "welcome back Gobee129" fehlerhaft.

RE: Bilder-Position im Header - SvePu - 13.01.2014

(13.01.2014, 16:50)Gobee129 schrieb: Thank you so far. Now all the allignments work, but the postions are incorrect:

Ach ich kann hier ja Deutsch schreiben xD Also text und bild sind jetzt gut nebeneinander, jedoch ist auf beiden Seiten noch deutlich sichtbar platz. ich möchte das bild auf der rechten siete schon ganz an den rand des header bekommen, und auch links ist der platz zwischen avatar und "welcome back Gobee129" fehlerhaft.

Du müsstest das Ganze noch via CSS an dein Layout anpassen. - Hatte MrBrechreiz aber auch schon so geschrieben! Wink

(13.01.2014, 05:01)MrBrechreiz schrieb: ....
Via CSS Klassen kannst Du da noch ein wenig gestaltung betreiben

RE: Bilder-Position im Header - Gobee129 - 13.01.2014

Ja hab ich auch gemacht eben Wink

Hab ein wenig an der Breite gedreht und ein paar verschoben, jez sieht es so aus:

Vielen Dank für eure Hilfe Smile

Bin froh, dass es jetzt funktioniert (Y)