I'm trying to create a menu using a list. I want it to look like lerge boxes with a graduated fill and it works fie on Firefox, Google Chrome, Safari and Internet Explorer my not Opera. In Opera the boxes come up in blue. Is this something to do with them being links and if so, how do I fix it? -
<div class="mainmenu">
-
<ul>
-
<li class='menu'><a href='link' class='active'>Home</a></li>
-
<li class='menu'><a href='link' class=''>Page</a></li>
-
...other pages
-
<li class='menu'><a href='link' class=''>Page</a></li>
-
</ul>
-
</div>
-
.mainmenu{
-
background-color:#131b59;
-
border: 1px solid #B9B3A4;
-
border-radius: 8px 8px 8px 8px;
-
}
-
.mainmenu ul{
-
padding:0;
-
margin:10px 0 10px 0;
-
list-style:none;
-
}
-
.mainmenu li{
-
padding:0 0 0 10px;
-
margin:0 0 0 0;
-
background:#131b59;
-
background-image:-moz-linear-gradient(top,#815d39,#b08f66);
-
background-image:-webkit-gradient(linear,left top,left bottom,from(#815d39),to(#b08f66));
-
filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#815d39,endColorStr=#b08f66);
-
height:35px;
-
line-height:35px;
-
text-align:left;
-
border:1px solid #ffffff;
-
border-bottom:1px #333333 solid;
-
}
-
.mainmenu li a{
-
font-family:arial;
-
font-size:13px;
-
font-weight:bold;
-
color:#FFFFFF;
-
text-decoration:none;
-
}
-
.mainmenu li:hover{
-
background-image:-moz-linear-gradient(top,#f0ce42,#815d39);
-
background-image:-webkit-gradient(linear,left top,left bottom,from(#f0ce42),to(#815d39));
-
filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#f0ce42,endColorStr=#815d39);
-
}
You have to use - background-image:-o-linear-gradient(top,#815d39,#b08f66);
for .mainmenu li
and - background-image:-o-linear-gradient(top,#f0ce42,#815d39);
for .mainmenu li:hover
-o-linear-gradient for Opera
-moz-linear-gradient for Mozilla
-webkit-gradient for webkit (Chrome, Safari)
Hope it's help you. :)
2 1647
You have to use - background-image:-o-linear-gradient(top,#815d39,#b08f66);
for .mainmenu li
and - background-image:-o-linear-gradient(top,#f0ce42,#815d39);
for .mainmenu li:hover
-o-linear-gradient for Opera
-moz-linear-gradient for Mozilla
-webkit-gradient for webkit (Chrome, Safari)
Hope it's help you. :)
Worked perfectly. Thank you ever so much. You're a hero.
Sign in to post your reply or Sign up for a free account.
Similar topics
by: Greg Raven |
last post by:
I styled my links just the way I want them using CSS, but now my linked
images have picked up these same styles. I've tried turning the styles
off for the images with:
a img
{
text-decoration:...
|
by: Thomas Mlynarczyk |
last post by:
Hi,
I just ran into some problems when I tried to "style" the <a> elements of a
page. Basically, I have something like this:
<div id="left">
<div id="menu">
<a href="bla">Bla</a>
</div>...
|
by: news |
last post by:
I have a site that pulls half its content from a database. Text that
will have links in it, that I won't be able to alter. They'll all be
like
<a href="link">blah</a>
But I want to give links...
|
by: SStory |
last post by:
I have a picturebox in my About form.
would like to have a link to my company website. Wanted the links
background to be transparent.
It seems that no one knows how to do this.
Have asked...
|
by: hestres |
last post by:
Hello,
I'm working on some link styles for this page:
http://www.house.gov/velazquez/lh0205tres/reports.html
I want all the links to always display in red (#CC0000), but in IE6
and 7 they...
|
by: -Lost |
last post by:
Sorry, for two separate browser questions, but I figured a multi-post about the same URL
might not get favorable results.
I am making a little website for the daycare my mother and wife works at...
|
by: beakersoft |
last post by:
Hi,
I've only just started playing about with CSS so there might be a really obvious answer to this.
In my style sheet i have the following to style the hyperlinks on the page:
a:link...
|
by: pereges |
last post by:
Hi, I am wondering which of the two data structures (link list or
array) would be better in my situation. I have to create a list of
rays for my ray tracing program.
the data structure of ray...
|
by: Charles Arthur |
last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
|
by: ryjfgjl |
last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
by: BarryA |
last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
|
by: Sonnysonu |
last post by:
This is the data of csv file
1 2 3
1 2 3
1 2 3
1 2 3
2 3
2 3
3
the lengths should be different i have to store the data by column-wise with in the specific length.
suppose the i have to...
|
by: Hystou |
last post by:
There are some requirements for setting up RAID:
1. The motherboard and BIOS support RAID configuration.
2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
|
by: Hystou |
last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers,...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
| |