MyBB Community Forums

Full Version: Space between icon and text in toplinks.
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Pages: 1 2
Hello,

Is it possible to get a space in my custom toplink.

http://imgur.com/frf1pbg

As you can see, there are a space in the calendar toplink, but not my donate toplink.
can we have your forum link .. you have to use similar code used for the calendar link
in general, it uses a list item code with background image
Hello .m.

www.smurfierp.com

I'm using this code for my custom toplinks.
But there are no spaces.

<li ><a href="http://smurfierp.com/showteam.php" target="_blank"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/star.png" alt="" title="Staff" />{$lang->toplinks_}</a ></li >
What is the css for the icon? It is probably in issue in there.
I'm not well known in all this.
In what file can I find the css for icons.. ?
in the given link you can simply add a space like below (though this is not perfect method)
<li><a href="http://smurfierp.com/showteam.php" target="_blank"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/star.png" alt="" title="Staff" />&nbsp;{$lang->toplinks_}</a></li> 

however best method is to use link like below and add the icon as a background image through global.css
<li><a class="stafftop" href="http://smurfierp.com/showteam.php" target="_blank">{$lang->toplinks_}</a></li>


#panel .upper ul.top_links a.stafftop {
    background-image: url("images/twilight/toplinks/star.png");
}
Oh thank you very much.
It's actually worked.
But the space is maybe too big?
^ do not use a space before and after &nbsp;
Thanks it works.
There is a long space between each toplinks..
Is there any way to get it fixed. ?
in the global.css of the theme (around line 67) find style properties like below
#panel ul.menu li a {
    background-position: left center;
    background-repeat: no-repeat;
    padding-left: 20px;
}
you can change padding-left: 20px; to padding-left: 5px;

global.css style sheet of the theme should be edited through admin panel themes section (in advanced edit mode)
and browser should be hard refreshed (eg. press CTRL + F5) after saving changes to the style sheet
Pages: 1 2