Friday 15 June 2012

html - Changing piece of top bar color in Foundation? -



html - Changing piece of top bar color in Foundation? -

alright, i'm mildly new using foundation , i've tried several 'fixes' i've found sorts of support, still can't figure out. bit circled in reddish won't alter same pinkish rest?

alright, had image, don't have reputation post it. basically, got code work drop downs, not little rectangle off left has nil in it.

i found snatch of code off person's question here on stackoverflow , modified it...

.top-bar { background: #ff859c !important; } .top-bar-section li a:not(.button) { background: #ff859c !important; } .top-bar-section li a:not(.button):hover { background: #bcd955 !important; } .top-bar-section ul li.active > { background: #ff859c !important; }

but it's not working? that's editing did it, life of me can't create work 1 rectangle.

yay! can post images!

![enter image description here][1]

well. whilst finding code bits show y'all, fixed myself. so, give thanks making me walk through more in depth!!

instead of copying code foundation's site, found in base of operations foundation css file.

@media screen , (min-width: 40.063em) { .top-bar { background: #016b98; overflow: visible; } .top-bar:before, .top-bar:after { content: " "; display: table; } .top-bar:after { clear: both; } .top-bar .toggle-topbar { display: none; } .top-bar .title-area { float: left; } .top-bar .name h1 { width: auto; } .top-bar input, .top-bar .button, .top-bar button { font-size: 0.875rem; position: relative; top: 7px; } .top-bar.expanded { background: #333333; }

therefore, give thanks help!

that first background bit needed be! find , confused, having problem changing color of (insert image still cannot post because need 10 it!).

anyway, give thanks again. very, much!

to alter color of drop downwards arrow in foundations menu, need add together code app.css file.

.top-bar-section .has-dropdown>a:after { border-top-color: #ff859c ;/*change ever color like*/ border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; }

note: if altering foundations default styles in normal css file, need add together !important tag end of style.

html css zurb-foundation

No comments:

Post a Comment