- This topic is empty.
-
AuthorPosts
-
February 26, 2010 at 7:16 am #28178
webmadter
MemberGuys, if anyone can help, please do it. I’m stuck.
This is a part of code:
Code:[size=150]-
” title=”” id=”navlogo”>
- Forum
- Forum
- Forum
- Forum
- Forum
- Forum
- Forum
- Forum
- Forum
- Forum
- 1
08Here’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.
27
[/size]
This is css part:
Code:#navlinks {background:#ebeadc url(http://bestinform.org/images/menuback.png) repeat-x 0 0; height:49;position: relative; width:100%;}
#navlogo a {float:left;display:block;height:49px;background:transparent url(http://bestinform.org/images/navigation.gif) 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(http://bestinform.org/images/navigation.gif) -177px 0;text-indent:-9999px;}
.navah a:hover {background-position:-177px -49px;}#naviq a {float:left;display:block;height:49px;width:66px;background:url(http://bestinform.org/images/navigation.gif) -248px 0;text-indent:-9999px;}
#naviq a:hover {background-position:-248px -49px;}#navrz a {float:left;display:block;height:49px;width:68px;background:url(http://bestinform.org/images/navigation.gif) -314px 0;text-indent:-9999px;}
#navrz a:hover {background-position:-314px -49px;}
#navspoil a {float:left;display:block;height:49px;width:85px;background:url(http://bestinform.org/images/navigation.gif) -382px 0;text-indent:-9999px;}
#navspoil a:hover {background-position:-382px -49px;}
#navforum a {float:left;display:block;height:49px;width:73px;background:url(http://bestinform.org/images/navigation.gif) -467px 0;text-indent:-9999px;}
#navforum a:hover {background-position:-467px -49px;}
#navblogs a {float:left;display:block;height:49px;width:89px;background:url(http://bestinform.org/images/navigation.gif) -540px 0;text-indent:-9999px;}
#navblogs a:hover {background-position:-540px -49px;}
#navgroups a {float:left;display:block;height:49px;width:77px;background:url(http://bestinform.org/images/navigation.gif) -629px 0;text-indent:-9999px;}
#navgroups a:hover {background-position:-629px -49px;}
#navmembers a {float:left;display:block;height:49px;width:93px;background:url(http://bestinform.org/images/navigation.gif) -706px 0;text-indent:-9999px;}
#navmembers a:hover {background-position:-706px -49px;}
#navstore a {float:left;display:block;height:49px;width:63px;background:url(http://bestinform.org/images/navigation.gif) -799px 0;text-indent:-9999px;}
#navstore a:hover {background-position:-799px -49px;}#navjoin a {float:left;display:block;height:49px;width:108px;background:url(http://bestinform.org/images/navigation.gif) -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:
[img]http://img203.imageshack.us/img203/7654/imageyr.gif[/img]
And in firefox and opera the right side display no background image:
[img]http://img40.imageshack.us/img40/8049/imagehg.gif[/img]
If you can help optimize this code i will appreciate this.
To rest the menu you can use this link:
There’s nothing to look at, only the menu )
February 26, 2010 at 11:58 am #71649webmadter
Member"virtual" wrote:I assume you have copied the code from the bestinform.org blog. If what you want to do is make it show straight across the page you need to addCode:#navlinks li {
display: inline;
}It’s my domain which i use for testing code online. I have added the line you gave and it works! Thank you very much!
If you could also help me to make the navlinks div to show background correct that would be more then just nice :)I mean my second screenshot. Opera and Firefox left main navlinks div without background and i dont know why. I tried variations with the last button (navrest, but is doesnt display background). The main template use fluid width so when the width will be more than 980 the navigation panel will be the same size as now on the left( That’s not good at all =(
Sorry for my english, it’s not my parent language.
February 26, 2010 at 12:51 pm #69520webmadter
Membersolved. thank you guys!
-
” title=”” id=”navlogo”>
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.