MyBB.de Forum

Normale Version: Bilder-Position im Header
Du siehst gerade eine vereinfachte Darstellung unserer Inhalte. Normale Ansicht mit richtiger Formatierung.
Hey Leute,

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

[attachment=8967]

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:

[attachment=8968]

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
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
(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><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

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

[attachment=8970]

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.
(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 Big Grin
Ja hab ich auch gemacht eben Wink Hab ein wenig an der Breite gedreht und ein paar <span> verschoben, jez sieht es so aus:

[attachment=8971]

Vielen Dank für eure Hilfe Smile Bin froh, dass es jetzt funktioniert (Y)