Can't change Auto-Nav background
Permalink Browser Info Environment
I switched the grey header background with a gradient that I created using an online gradient code generator. So in the main.css file I changed the col1 background to:
background-color: rgb(87,90,96); /* Old browsers */
background: -moz-linear-gradient(top, rgba(87,90,96,1) 0%, rgba(30,30,30,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(87,90,96,1)), color-stop(100%,rgba(30,30,30,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(87,90,96,1) 0%,rgba(30,30,30,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(87,90,96,1) 0%,rgba(30,30,30,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(87,90,96,1) 0%,rgba(30,30,30,1) 100%); /* IE10+ */
background: linear-gradient(top, rgba(87,90,96,1) 0%,rgba(30,30,30,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#575a60', endColorstr='#1e1e1e',GradientType=0 ); /* IE6-9 */
That worked, but the Auto-Nav background automatically took on the gradient background. I've included a screenshot as an attachment. I've tried to delete the auto-nav background in the header nav section of the main.css, but it seems to have no affect whatsoever.
background-color: rgb(87,90,96); /* Old browsers */
background: -moz-linear-gradient(top, rgba(87,90,96,1) 0%, rgba(30,30,30,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(87,90,96,1)), color-stop(100%,rgba(30,30,30,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(87,90,96,1) 0%,rgba(30,30,30,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(87,90,96,1) 0%,rgba(30,30,30,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(87,90,96,1) 0%,rgba(30,30,30,1) 100%); /* IE10+ */
background: linear-gradient(top, rgba(87,90,96,1) 0%,rgba(30,30,30,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#575a60', endColorstr='#1e1e1e',GradientType=0 ); /* IE6-9 */
That worked, but the Auto-Nav background automatically took on the gradient background. I've included a screenshot as an attachment. I've tried to delete the auto-nav background in the header nav section of the main.css, but it seems to have no affect whatsoever.
| Type: | Discussion |
|---|---|
| Status: | New |
Hey Ryan. I've tried that. I've deleted the background-color line from the main.css, but it has no effect on the website. I've made sure to clear the cache in Concrete5, and the auto-nav background is still showing up.
post a link to your site and I'll take a look.
The root home page has an under construction" page up on it, but you can see the rest of the site from here:
http://www.stopmotionmontreal.com/index.php/eng...
http://www.stopmotionmontreal.com/index.php/eng...
line 32 of the main.css delete ' .col1 a ' from the class name.
Your links are sharing the same background as the area which is why the buttons have the same gradient overlay.
Your links are sharing the same background as the area which is why the buttons have the same gradient overlay.
That seems to have done the trick. Thanks so much for your help!
make sure you delete the comma as well. your code should read,
.col1 { background: -moz-linear-gradient(center top , #575A60 0%, #1E1E1E 100%) repeat scroll 0 0 transparent; color: #FFFFFF; }
I only converted this theme and left most of the original developers code intact. That developer felt like have a background color on the "a href" of the menu was important. Just delete the background color element out of line 101 on the main.css and you should be all set.
Thanks,
Ryan Vars
RynoMedia
aka Cannonf700