The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS i want these css buttons badly!

  • This topic is empty.
Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
  • #29671

    just wanted to have the navigation exactly like this , and put that in this site

    ive tried myself by copying the css code

    #navigation ul > a, #navigation > ul li a:hover, #navigation ul li.sub-nav:hover > a {
    background:-moz-linear-gradient(center top , #88D790, #55AB61) repeat scroll 0 0 transparent;
    #navigation ul li.sub-nav > a:hover:before, #navigation ul li.sub-nav:hover > a:before {
    border-top-color:#ADE9B6 !important;
    #navigation ul li.sub-nav > a:hover:after, #navigation ul li.sub-nav:hover > a:after {
    border-top-color:#55AB61 !important;
    #navigation ul ul li a:hover {}

    but nothing changed in my site
    maybe the code i chose arent right !

    Here is my site CSS navigation (

    #menu {
    overflow: hidden;
    clear: both;
    /*background: #ffffff url(/navi_bg.png) no-repeat center bottom;
    border-top: 0px solid #dedcd0;
    background: url() repeat ; /* customizable.advanced.background.33.[Navigation Background] */
    #nav {
    margin: 0 auto;
    width: 960px;
    list-style: none;
    padding: 0;
    #nav li.selected a {
    color: #b0c387;
    #nav ul {
    list-style: none;
    #nav li {
    float: left;
    #nav li a, #nav li.unselected a {
    /*border-right: 1px solid #b0c387;
    font-size: 12px;
    color: #333; /* customizable.advanced.color.07.[Navigation Link Color] */
    text-decoration: none;
    padding: 8px 11px;
    line-height: 18px;
    text-shadow: 0 1px #fff;
    -webkit-transition: color 0.5s ease-in-out;
    -moz-transition: color 0.5s ease-in-out;
    -o-transition: color 0.5s ease-in-out;
    #nav li:first-child {
    border-left: 1px solid #dedbd1;
    #nav li a:hover {
    background: transparent url() repeat ; /* customizable.advanced.background.08.[Navigation Link Hover Background] */
    color: #b0c387; /* customizable.advanced.color.31.[Navigation Link Hover Color] */

    please tell me what should i do to make it right



    The css you copied calls for #navigation, in your css you are calling it #nav, try renaming it ;)


    ah, the old "copy and pasted styles but didn’t change the id" scenario, classic




    I made it , and i had to change #menu not #nav

    However i have 2 problems
    1-sub menu changed to that color aswell which i dont want to . how can i keep the submenu in bg white and font black ? when the one button has been selected the menu changed to the button i wanted (green) and sub menu as well(green)

    2- i copied the code but still cannot see that TRIANGLE in center bottom of each bottoms that includes SUB MENU.



    Hey guys, how about that ol’ copyright infringement thing? Remember, using a site as inspiration is one thing, but actually taking someone else’s code is a whole other deal.


    I don’t usually copy other peoples code. Sometimes I reuse some of my other code or take code from a working model that I can’t figure out. But I always customize it to be quite original. I’d never take something and keep it verbatim


    my question is too clear and both related to this subject , and i changed the code from the original to that i wanted , the only thing that i needed to copy was

    background:-moz-linear-gradient(center top , #88D790, #55AB61) repeat scroll 0 0 transparent;

    However i changed the color of that as well, but i want to know about that triangle which i have told about it before.

Viewing 8 posts - 1 through 8 (of 8 total)
  • The forum ‘CSS’ is closed to new topics and replies.