I was wondering how I can make a rounded wiki navigation bar like the one on this wiki: The Sims Wiki
I pretty much just want it to look the same on my wiki, but blue instead.
I'd love to receive a reply as soon as possible. Thank you!
I was wondering how I can make a rounded wiki navigation bar like the one on this wiki: The Sims Wiki
I pretty much just want it to look the same on my wiki, but blue instead.
I'd love to receive a reply as soon as possible. Thank you!
It's not working...
I'm not sure why. :/
Do I have to wait for a day or two? I've refreshed Chrome thorugh Ctrl F5, I've cleared my cache, but it just won't work.
There you go.
You did a bad copy in which the new code overlapped existing code as seen below.
.messagebox.small { width: 238px; font-size: 85%; float: right; clear: both; margin: 0 0 1em 1em; line-height: 1.25em; .WikiHeader .nav > li.marked { border-radius: 0.75em 0.75em 0 0; overflow: hidden; } .WikiHeader { border-radius: 0.75em 0.75em 0 0; border-bottom: 2px solid white; -webkit-box-shadow: 0 0 1em white; -moz-box-shadow: 0 0 1em #FFF; box-shadow: 0 0 1em white; margin-bottom: 10px; }
The above should have looked like:
.messagebox.small { width: 238px; font-size: 85%; float: right; clear: both; margin: 0 0 1em 1em; line-height: 1.25em; } .WikiHeader .nav > li.marked { border-radius: 0.75em 0.75em 0 0; overflow: hidden; } .WikiHeader { border-radius: 0.75em 0.75em 0 0; border-bottom: 2px solid white; -webkit-box-shadow: 0 0 1em white; -moz-box-shadow: 0 0 1em #FFF; box-shadow: 0 0 1em white; margin-bottom: 10px; }
Probably the selectors. You should apply the bottom rounded corners on .WikiHeader .navbackground
and the bottom rounded corners on .WikiHeader .nav > li.marked
Sorry, I'm just really new to coding. Would it be too much trouble for one of you to do it?
Wait, wait. It looks like it's working.
Alright, I'm almost there. The last thing I would like to have is the white background.
On their header, a white background is used. Also, they have a custom background that goes through the whole thing.
I hope you understand what I'm talking about. All I want is that white portion. Do you see how mine just goes with the blue background?
Thank you for all the help so far!
I believe the following will work:
.WikiHeader nav { background-color:rgba(255, 255, 255, 0.8); width:auto; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; -khtml-border-radius: 2px; }
If you gave me Admin rights over there temporarily I could fix it for you. When I said you made a copy mistake and I included .messagebox.small I didn't mean to copy that again. That was already in the CSS and I was using that to illustrate the copying error.