MyBB Community Forums

Full Version: [how to?] help me for edit my header please!
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Hi!
I use apart theme, I edited it for my rtl forum but I have a bad problem.
icons are right of links in ff and chrome and under links in opera.

how can I edit it?
Global.CSS and it's classes!

.wrapper {
	width: 85%;
	min-width: 970px;
	max-width: 1500px;
	margin: auto auto;
}

#logo {
	background: #000000 url(images/1/header.png) top left repeat;
	border-bottom: 1px solid #000000;
}

#content {
	background: #fff;
	width: auto !important;
	padding: 20px 10px;
	overflow: hidden;
}

#panel ul.menu {
	margin: 0;
	padding: 0;
	list-style: none;
}

#panel ul.menu li {
	margin: 0 7px;
	display: inline;
}

#panel ul.menu li a {
	padding-left: 15px;
	background-repeat: no-repeat;
	background-position: left center;
}

#panel .upper ul.top_links {
	float: right;
	font-size: 10px;
	font-weight: bold;
}

#panel .upper ul.top_links a.search {
	background-image: url(images/1/icons/search.gif);
}

#panel .upper ul.top_links a.portal {
	background-image: url(images/1/portal.png);
}

#panel .upper ul.top_links a.upcenter {
	background-image: url(images/1/up.png);
}

#panel .upper ul.top_links a.memberlist {
	background-image: url(images/1/icons/memberlist.gif);
}

#panel .upper ul.top_links a.calendar {
	background-image: url(images/1/icons/calendar.gif);
}

#panel .upper ul.top_links a.help {
	background-image: url(images/1/icons/help.gif);
}

#panel .upper a.logout {
	font-weight: bold;
	background: url(images/1/icons/logout.gif) right no-repeat;
	padding-right: 20px;
	margin-left: 9px;
}

#panel .upper a.login,
#panel .upper a.lost_password {
	background: url(images/1/icons/login.gif) no-repeat;
	padding-left: 20px;
	margin-left: 8px;
	font-weight: bold;
}

#panel .upper a.register {
	background: url(images/1/icons/logout.gif) right no-repeat;
	padding-right: 20px;
	margin-left: 8px;
	font-weight: bold;
}

#panel .lower ul.panel_links {
	float: right;
}

#panel .lower ul.panel_links a.usercp {
	background-image: url(images/1/icons/usercp.gif);
}

#panel .lower ul.panel_links a.modcp {
	background-image: url(images/1/icons/modcp.gif);
}

#panel .lower ul.panel_links a.admincp {
	background-image: url(images/1/icons/admincp.gif);
}

#panel .lower ul.user_links {
	float: right;
}

#panel .lower ul.user_links li a {
	padding: 0;
}

#panel .upper {
	background: #dcdbdc url(images/1/tcat.png) repeat-x;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #bbb;
	padding: 7px;
}

#panel .lower {
	background: #efefef;
	color: #999;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #ccc;
	overflow: hidden;
	padding: 5px;
}

#panel .lower a:link,
#panel .lower a:visited {
	color: #666;
}

#panel .lower a:hover,
#panel .lower a:active {
	color: #333;
	text-decoration: none;
}

#panel .remember_me input {
	vertical-align: middle;
	margin: -3px 0 0 5px;
}

#panel input {
	margin: -3px 0;
}

#panel input.button {
	padding: 0;
}

Header template codes:
<div id="container">
		<a name="top" id="top"></a>
		<div id="header">
			<div id="logo">

				<div class="wrapper">

					<a href="{$mybb->settings['bburl']}/index.php"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" title="{$mybb->settings['bbname']}" /></a>
				<div id="dojo-banner"><a href="http://iranbiologists.com/lab" title="Biology Labs Online" target="_blank"><img src="{$mybb->settings['bburl']}/images/1/lab0.png"></a></div></div>
			</div>

			<div id="panel">
				<div class="upper"><!-- This div(class="upper") is closed in the header_welcomeblock_member and header_welcomeblock_guest templates -->
					<div class="wrapper">
						<ul class="menu top_links" style="float:left;">
							<li><a href="{$mybb->settings['bburl']}/portal.php" class="portal">پرتال</a></li>
							<li><a href="http://iranbiologists.com/up" class="upcenter">آپلود سنتر</a></li>
							<li><a href="{$mybb->settings['bburl']}/search.php" class="search">{$lang->toplinks_search}</a></li>
							<li><a href="{$mybb->settings['bburl']}/memberlist.php" class="memberlist">{$lang->toplinks_memberlist}</a></li>
							<li><a href="{$mybb->settings['bburl']}/calendar.php" class="calendar">{$lang->toplinks_calendar}</a></li>
						</ul>
						{$welcomeblock}
			</div>
		</div>
<div id="container2">
		<div id="content">
			<div class="wrapper">
</div>
				{$pm_notice}
				{$bannedwarning}
				{$bbclosedwarning}
				{$unreadreports}{$mysupport_tech_notice}{$mysupport_assign_notice}
 {$headerannounce}
				{$pending_joinrequests}
				<navigation>
				<br />

My forum url: http://iranbiologists.com
I attach a screenshot from my issue!

Thanks a lot!
Add this code after every link css attribute i.e :
for all codes looking like this :
#panel .upper ul.top_links a.search,#panel .upper ul.top_links a.portal etc...

code:
background-position-x: -2px;

it looks like :

#panel .upper ul.top_links a.search {
background: url(images/1/icons/search.gif)top left no-repeat;
background-position-x: -2px;
}

Hope this helps,
regards
Thanks a lot envira!
I checked it on localhost but I didn't see changes! :-(
#panel .upper ul.top_links a.search {
background: url(images/1/icons/search.gif)top left no-repeat;
margin-left: -10px;
}