Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
A long one for you pros!
#21
Try this;
<div id="container">
        <a name="top" id="top"></a>
        <div id="header">
            <div class="menu">
                <ul>
                    <li><a href="{$mybb->settings['bburl']}/search.php"><img src="{$theme['imgdir']}/toplinks/search.png" alt="" title="" />{$lang->toplinks_search}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/memberlist.php"><img src="{$theme['imgdir']}/toplinks/memberlist.png" alt="" title="" />{$lang->toplinks_memberlist}</a></li>
                    <li><a href="http://forums.xomby.org/misc.php?page=irc"><img src="{$theme['imgdir']}/toplinks/irc.png" alt="" title="" />IRC Chat</a></li>
                </ul>
            </div><br/><br/>
            <div style="border: solid #fff 2px;  float: right;"><img src="{$mybb->user['avatar']}" width="100px" height="100px"></div>
            <hr class="hidden" />
<div id="panel">{$welcomeblock}</div>
        </div>
        <hr class="hidden" />
        <br class="clear" />
        <div id="content">
            {$pm_notice}{$teradonate_notice}{$teradonate_bar}
            {$bannedwarning}
            {$bbclosedwarning}
            {$unreadreports}
{$headerannounce}
            {$pending_joinrequests}
            <navigation>
            <br />
Reply
#22
(05-20-2011, 09:51 PM)Yaldaram Wrote: Try this;
<div id="container">
        <a name="top" id="top"></a>
        <div id="header">
            <div class="menu">
                <ul>
                    <li><a href="{$mybb->settings['bburl']}/search.php"><img src="{$theme['imgdir']}/toplinks/search.png" alt="" title="" />{$lang->toplinks_search}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/memberlist.php"><img src="{$theme['imgdir']}/toplinks/memberlist.png" alt="" title="" />{$lang->toplinks_memberlist}</a></li>
                    <li><a href="http://forums.xomby.org/misc.php?page=irc"><img src="{$theme['imgdir']}/toplinks/irc.png" alt="" title="" />IRC Chat</a></li>
                </ul>
            </div><br/><br/>
            <div style="border: solid #fff 2px;  float: right;"><img src="{$mybb->user['avatar']}" width="100px" height="100px"></div>
            <hr class="hidden" />
<div id="panel">{$welcomeblock}</div>
        </div>
        <hr class="hidden" />
        <br class="clear" />
        <div id="content">
            {$pm_notice}{$teradonate_notice}{$teradonate_bar}
            {$bannedwarning}
            {$bbclosedwarning}
            {$unreadreports}
{$headerannounce}
            {$pending_joinrequests}
            <navigation>
            <br />

Yes, but that will push everything below it down, I am guessing.
Reply
#23
(05-20-2011, 09:51 PM)Matt G. Wrote: Just Guessing on the amount of padding.
<div id="container">
        <a name="top" id="top"></a>
        <div id="header">
            <div class="menu">
                <ul>
                    <li><a href="{$mybb->settings['bburl']}/search.php"><img src="{$theme['imgdir']}/toplinks/search.png" alt="" title="" />{$lang->toplinks_search}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/memberlist.php"><img src="{$theme['imgdir']}/toplinks/memberlist.png" alt="" title="" />{$lang->toplinks_memberlist}</a></li>
                    <li><a href="http://forums.xomby.org/misc.php?page=irc"><img src="{$theme['imgdir']}/toplinks/irc.png" alt="" title="" />IRC Chat</a></li>
                </ul>
            </div>
            <div style="border: solid #fff 2px;  float: right; padding-top: 30px;"><img src="{$mybb->user['avatar']}" width="100px" height="100px"></div>
            <hr class="hidden" />
<div id="panel">{$welcomeblock}</div>
        </div>
        <hr class="hidden" />
        <br class="clear" />
        <div id="content">
            {$pm_notice}{$teradonate_notice}{$teradonate_bar}
            {$bannedwarning}
            {$bbclosedwarning}
            {$unreadreports}
{$headerannounce}
            {$pending_joinrequests}
            <navigation>
            <br />

Is that fine?

edit: Oops, try this instead
<div id="container">
        <a name="top" id="top"></a>
        <div id="header">
            <div class="menu">
                <ul>
                    <li><a href="{$mybb->settings['bburl']}/search.php"><img src="{$theme['imgdir']}/toplinks/search.png" alt="" title="" />{$lang->toplinks_search}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/memberlist.php"><img src="{$theme['imgdir']}/toplinks/memberlist.png" alt="" title="" />{$lang->toplinks_memberlist}</a></li>
                    <li><a href="http://forums.xomby.org/misc.php?page=irc"><img src="{$theme['imgdir']}/toplinks/irc.png" alt="" title="" />IRC Chat</a></li>
                </ul>
            </div>
            <div style="border: solid #fff 2px;  float: right; margin-top: 30px;"><img src="{$mybb->user['avatar']}" width="100px" height="100px"></div>
            <hr class="hidden" />
<div id="panel">{$welcomeblock}</div>
        </div>
        <hr class="hidden" />
        <br class="clear" />
        <div id="content">
            {$pm_notice}{$teradonate_notice}{$teradonate_bar}
            {$bannedwarning}
            {$bbclosedwarning}
            {$unreadreports}
{$headerannounce}
            {$pending_joinrequests}
            <navigation>
            <br />

The 2nd one is the winner here Smile Now is there anyway to add some padding to the right so it's not so close to the right border thing there? And maybe a way to round the borders of say the avatar? If that's too difficult just let me know Smile
Reply
#24
(too late) Use margins:

<div id="container">
        <a name="top" id="top"></a>
        <div id="header">
            <div class="menu">
                <ul>
                    <li><a href="{$mybb->settings['bburl']}/search.php"><img src="{$theme['imgdir']}/toplinks/search.png" alt="" title="" />{$lang->toplinks_search}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/memberlist.php"><img src="{$theme['imgdir']}/toplinks/memberlist.png" alt="" title="" />{$lang->toplinks_memberlist}</a></li>
                    <li><a href="http://forums.xomby.org/misc.php?page=irc"><img src="{$theme['imgdir']}/toplinks/irc.png" alt="" title="" />IRC Chat</a></li>
                </ul>
            </div>
            <div style="border: solid #fff 2px; float: right; margin-top: 50px;"><img src="{$mybb->user['avatar']}" width="100px" height="100px"></div>
            <hr class="hidden" />
<div id="panel">{$welcomeblock}</div>
        </div>
        <hr class="hidden" />
        <br class="clear" />
        <div id="content">
            {$pm_notice}{$teradonate_notice}{$teradonate_bar}
            {$bannedwarning}
            {$bbclosedwarning}
            {$unreadreports}
{$headerannounce}
            {$pending_joinrequests}
            <navigation>
            <br />

I'm not sure if 50px is enough though, so change it accordingly until it's where you want it.
Reply
#25
(05-20-2011, 09:55 PM)faviouz Wrote: Use margins:

<div id="container">
        <a name="top" id="top"></a>
        <div id="header">
            <div class="menu">
                <ul>
                    <li><a href="{$mybb->settings['bburl']}/search.php"><img src="{$theme['imgdir']}/toplinks/search.png" alt="" title="" />{$lang->toplinks_search}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/memberlist.php"><img src="{$theme['imgdir']}/toplinks/memberlist.png" alt="" title="" />{$lang->toplinks_memberlist}</a></li>
                    <li><a href="http://forums.xomby.org/misc.php?page=irc"><img src="{$theme['imgdir']}/toplinks/irc.png" alt="" title="" />IRC Chat</a></li>
                </ul>
            </div>
            <div style="border: solid #fff 2px; float: right; margin-top: 50px;"><img src="{$mybb->user['avatar']}" width="100px" height="100px"></div>
            <hr class="hidden" />
<div id="panel">{$welcomeblock}</div>
        </div>
        <hr class="hidden" />
        <br class="clear" />
        <div id="content">
            {$pm_notice}{$teradonate_notice}{$teradonate_bar}
            {$bannedwarning}
            {$bbclosedwarning}
            {$unreadreports}
{$headerannounce}
            {$pending_joinrequests}
            <navigation>
            <br />

I'm not sure if 50px is enough though, so change it accordingly until it's where you want it.

Yea, I guess margins after I realized padding would just push it all down.



(05-20-2011, 09:55 PM)xomp Wrote:
(05-20-2011, 09:51 PM)Matt G. Wrote: Just Guessing on the amount of padding.
<div id="container">
        <a name="top" id="top"></a>
        <div id="header">
            <div class="menu">
                <ul>
                    <li><a href="{$mybb->settings['bburl']}/search.php"><img src="{$theme['imgdir']}/toplinks/search.png" alt="" title="" />{$lang->toplinks_search}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/memberlist.php"><img src="{$theme['imgdir']}/toplinks/memberlist.png" alt="" title="" />{$lang->toplinks_memberlist}</a></li>
                    <li><a href="http://forums.xomby.org/misc.php?page=irc"><img src="{$theme['imgdir']}/toplinks/irc.png" alt="" title="" />IRC Chat</a></li>
                </ul>
            </div>
            <div style="border: solid #fff 2px;  float: right; padding-top: 30px;"><img src="{$mybb->user['avatar']}" width="100px" height="100px"></div>
            <hr class="hidden" />
<div id="panel">{$welcomeblock}</div>
        </div>
        <hr class="hidden" />
        <br class="clear" />
        <div id="content">
            {$pm_notice}{$teradonate_notice}{$teradonate_bar}
            {$bannedwarning}
            {$bbclosedwarning}
            {$unreadreports}
{$headerannounce}
            {$pending_joinrequests}
            <navigation>
            <br />

Is that fine?

edit: Oops, try this instead
<div id="container">
        <a name="top" id="top"></a>
        <div id="header">
            <div class="menu">
                <ul>
                    <li><a href="{$mybb->settings['bburl']}/search.php"><img src="{$theme['imgdir']}/toplinks/search.png" alt="" title="" />{$lang->toplinks_search}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/memberlist.php"><img src="{$theme['imgdir']}/toplinks/memberlist.png" alt="" title="" />{$lang->toplinks_memberlist}</a></li>
                    <li><a href="http://forums.xomby.org/misc.php?page=irc"><img src="{$theme['imgdir']}/toplinks/irc.png" alt="" title="" />IRC Chat</a></li>
                </ul>
            </div>
            <div style="border: solid #fff 2px;  float: right; margin-top: 30px;"><img src="{$mybb->user['avatar']}" width="100px" height="100px"></div>
            <hr class="hidden" />
<div id="panel">{$welcomeblock}</div>
        </div>
        <hr class="hidden" />
        <br class="clear" />
        <div id="content">
            {$pm_notice}{$teradonate_notice}{$teradonate_bar}
            {$bannedwarning}
            {$bbclosedwarning}
            {$unreadreports}
{$headerannounce}
            {$pending_joinrequests}
            <navigation>
            <br />

The 2nd one is the winner here Smile Now is there anyway to add some padding to the right so it's not so close to the right border thing there? And maybe a way to round the borders of say the avatar? If that's too difficult just let me know Smile

<div id="container">
        <a name="top" id="top"></a>
        <div id="header">
            <div class="menu">
                <ul>
                    <li><a href="{$mybb->settings['bburl']}/search.php"><img src="{$theme['imgdir']}/toplinks/search.png" alt="" title="" />{$lang->toplinks_search}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/memberlist.php"><img src="{$theme['imgdir']}/toplinks/memberlist.png" alt="" title="" />{$lang->toplinks_memberlist}</a></li>
                    <li><a href="http://forums.xomby.org/misc.php?page=irc"><img src="{$theme['imgdir']}/toplinks/irc.png" alt="" title="" />IRC Chat</a></li>
                </ul>
            </div>
            <div style="border: solid #fff 2px;  float: right; margin-top: 30px; padding-right: 20px; -moz-border-radius: 5px;
border-radius: 5px;"><img src="{$mybb->user['avatar']}" width="100px" height="100px"></div>
            <hr class="hidden" />
<div id="panel">{$welcomeblock}</div>
        </div>
        <hr class="hidden" />
        <br class="clear" />
        <div id="content">
            {$pm_notice}{$teradonate_notice}{$teradonate_bar}
            {$bannedwarning}
            {$bbclosedwarning}
            {$unreadreports}
{$headerannounce}
            {$pending_joinrequests}
            <navigation>
            <br />

Rounded corners doesn't work in IE older versions.
Reply
#26
Yes, margins seem to be a better option there Smile now to get the right-side padded so it's not on the border line there heh
Reply
#27
Right padding and rounded avatar:

<div style="border: solid #fff 2px; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; float: right; margin-top: 50px; padding-right: 10px"><img src="{$mybb->user['avatar']}" width="100px" height="100px" style="border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;"></div>

You might want to move that inline styling to your stylesheet once you're done.
Reply
#28
Edited my post. lol, both posted at same time.
Reply
#29
That won't work, because you're rounding the div and not the image. Therefore only the surronding border will be rounded. Smile I believe what I suggested works though.
Reply
#30
Okay yeah, I see what you did. You had to round both the border and the image. Forgot about that. Good Work Smile
Reply


Forum Jump:


Users browsing this thread: 1 Guest(s)