No replies
webmadter
webmadter's picture
Offline
newbie
Last seen: 12 years 48 weeks ago
Timezone: GMT+3
Joined: 2010-02-26
Posts: 1
Points: 2

Guys, if anyone can help, please do it. I'm stuck.

This is a part of code:

        <div id="navlinks"><ul> 
			<li id="navlogo"> 
				<a href="<?php bloginfo('url'); ?>" title="<?php bloginfo('name'); ?>" id="navlogo">
<?php bloginfo('name'); ?>
</a>
			</li> 
			<li class="navah"> 
				<a href="#" id="navah">Forum</a> 
 
			</li> 
 
            <div class="ahdropped">
08	<p>Here's an example of a paragraph inside the drop-down panel. We placed this paragraph in the left column. Then we have 2 more columns on the right with a H3 for the section title and then we have unordered lists.</p>
 
27	</div>
            <li id="naviq"> 
				<a href="#" id="naviq">Forum</a> 
 
			</li> 
              <li id="navrz"> 
				<a href="#" id="navrz">Forum</a> 
 
			</li> 
 
 
              <li id="navspoil"> 
				<a href="#" id="navrz">Forum</a> 
 
			</li> 
 
              <li id="navforum"> 
				<a href="#" id="navforum">Forum</a> 
 
			</li> 
 
              <li id="navblogs"> 
				<a href="#" id="navblogs">Forum</a> 
 
			</li> 
 
              <li id="navgroups"> 
				<a href="#" id="navgroups">Forum</a> 
 
			</li> 
              <li id="navmembers"> 
				<a href="#" id="navmembers">Forum</a> 
 
			</li> 
              <li id="navstore"> 
				<a href="#" id="navstore">Forum</a> 
 
			</li> 	
            </li> 
              <li id="navjoin"> 
				<a href="#" id="navjoin">Forum</a> 
 
			</li> 	<li id="navrest"><a href="#" id ="navrest">1</a></li>
		</ul> </div>

This is css part:

#navlinks {background:#ebeadc url(<a href="http://bestinform.org/images/menuback.png" rel="nofollow">http://bestinform.org/images/menuback.png</a>) repeat-x 0 0; height:49;position: relative; width:100%;}
#navlogo a {float:left;display:block;height:49px;background:transparent url(<a href="http://bestinform.org/images/navigation.gif" rel="nofollow">http://bestinform.org/images/navigation.gif</a>) 0 0;text-indent:-9999px;width:177px;}
#navlogo a:hover {background-position:0 -49px;}
 
.navah a {float:left;display:block;height:49px;width:71px;background:url(<a href="http://bestinform.org/images/navigation.gif" rel="nofollow">http://bestinform.org/images/navigation.gif</a>) -177px 0;text-indent:-9999px;}
.navah a:hover {background-position:-177px -49px;}
 
#naviq a {float:left;display:block;height:49px;width:66px;background:url(<a href="http://bestinform.org/images/navigation.gif" rel="nofollow">http://bestinform.org/images/navigation.gif</a>) -248px 0;text-indent:-9999px;}
#naviq a:hover {background-position:-248px -49px;}
 
#navrz a {float:left;display:block;height:49px;width:68px;background:url(<a href="http://bestinform.org/images/navigation.gif" rel="nofollow">http://bestinform.org/images/navigation.gif</a>) -314px 0;text-indent:-9999px;}
#navrz a:hover {background-position:-314px -49px;}
#navspoil a {float:left;display:block;height:49px;width:85px;background:url(<a href="http://bestinform.org/images/navigation.gif" rel="nofollow">http://bestinform.org/images/navigation.gif</a>) -382px 0;text-indent:-9999px;}
#navspoil a:hover {background-position:-382px -49px;}
#navforum a {float:left;display:block;height:49px;width:73px;background:url(<a href="http://bestinform.org/images/navigation.gif" rel="nofollow">http://bestinform.org/images/navigation.gif</a>) -467px 0;text-indent:-9999px;}
#navforum a:hover {background-position:-467px -49px;}
#navblogs a {float:left;display:block;height:49px;width:89px;background:url(<a href="http://bestinform.org/images/navigation.gif" rel="nofollow">http://bestinform.org/images/navigation.gif</a>) -540px 0;text-indent:-9999px;}
#navblogs a:hover {background-position:-540px -49px;}
#navgroups a {float:left;display:block;height:49px;width:77px;background:url(<a href="http://bestinform.org/images/navigation.gif" rel="nofollow">http://bestinform.org/images/navigation.gif</a>) -629px 0;text-indent:-9999px;}
#navgroups a:hover {background-position:-629px -49px;}
#navmembers a {float:left;display:block;height:49px;width:93px;background:url(<a href="http://bestinform.org/images/navigation.gif" rel="nofollow">http://bestinform.org/images/navigation.gif</a>) -706px 0;text-indent:-9999px;}
#navmembers a:hover {background-position:-706px -49px;}
#navstore a {float:left;display:block;height:49px;width:63px;background:url(<a href="http://bestinform.org/images/navigation.gif" rel="nofollow">http://bestinform.org/images/navigation.gif</a>) -799px 0;text-indent:-9999px;}
#navstore a:hover {background-position:-799px -49px;}
 
#navjoin a {float:left;display:block;height:49px;width:108px;background:url(<a href="http://bestinform.org/images/navigation.gif" rel="nofollow">http://bestinform.org/images/navigation.gif</a>) -862px 0;text-indent:-9999px;}
#navjoin a:hover {background-position:-862px -49px;}
#navrest a {float:right;display:block; height:49px; text-align:right;margin:auto;width:auto;background:url(../images/menuback.png)repeat-x;text-indent:-9999px;}
#navrest li {float:left;display:block; height:49px; margin:auto;width:auto;background:url(../images/menuback.png)repeat-x;text-indent:-9999px;}

This is menu, that use 1 background pic for all buttons. The css is huge but i cannot minimize it( I'm not that good in css. And In most of old versions of brousers the buttons looks like cascade:

And in firefox and opera the right side display no background image:

If you can help optimize this code i will appreciate this.

To rest the menu you can use this link:

Blablbla

There's nothing to look at, only the menu )