[CSS - CLASSIC] All top bar mods for your list with animated previews

Icon topbar (black) originally made by Kyouhansha.
Redux topbar originally made by Veriti.
Clean topbar originally made by Luxiamimi (now goes by ReMinoer).
Space topbar originally made by Tansam12 (afaik).
Opal topbar originally made by Kezian (afaik).
Vertical, Tab, Bottom Tab, Cross, and Mirrai Nikki topbars originally made by Hahaido.

Category menu for Icon topbars coded by Al_exs.

Touhou Icon topbar reskinned by Shishio-kun.
SAO, Shura, and Ranka Lee Icon topbars reskinned by SylakentH.
Multi-color, bright pink, turqouise, red, and blue Icon topbars (with white border) colored by TheHolyPotato.
Blue Icon topbar (without white border) colored by SylakentH.
Dark pink Icon topbar colored by PinkSheep.

"Customizable" Icon and Redux topbars edited heavily by Shishio-kun (me), with help from Veriti. I also edited the Clean, Space, and Opal topbars to allow them use on more list types.

Shishio-kun said:
Might be better to move the image codes to the top with notes, if there is enough interest.

BenuSama said:
Is there no way to fix this top-bar's compatibility with other browsers beside Friefox?

Shishio-kun said:


It works in all 4 major browsers from what I see. You're probably using a out-dated browser, so update it first..

u531355 said:
I don't see any problem on your screenshot ... It just displays less information when you're not logged in.

Shishio-kun said:
There were some browsers issues with your menu button for the icon toolbar in other browsers, so if you're happen to be working on it, you might want to look at the changes I added. The first one is to remove something from Safari and the other two make adjustments in IE9 which is such a broken browser. IE looks a little different but close enough and its always broken so its not worth looking into much.

@media screen and (-webkit-min-device-pixel-ratio:0){
div > table:first-of-type{
height: 0px !important;
}
}

:root div > table:first-of-type {
right: 68px \0/;
}

:root div > table:first-of-type a {
margin-left: 60px \0/;
}

al_exs said:


This fix some issues, but IE is IE, and as always can't show this well.

Hahaido said:
I'd like to represent my top bar menu design:
http://myanimelist.net/forum/?topicid=589179

TheHolyPotato said:
The bright pink, cerulean, and blue with white border were re colored by me. SylakentH_ did the blue without border :)

PinkSheep said:
I recolored the dark pink one owo

GarlicPaste said:
Does that mean one of you guys would know what to change to have it positioned on the left side then or?

TheHolyPotato said:
Multi color: https://dl.dropbox.com/s/6ruszt29qyk3yzi/SakorasouTopBar.css
Red: https://dl.dropbox.com/s/8vjos6cpj8yo4ek/RedTopBar.css

Gwabanaba said:
Hi I was trying to do the Black/grey icon-style top bar (8 versions) with the Fixed on left with Category menu, but on my page, the menu button is in the middle and when I hover my mouse over it it moves to back to the left where it's supposed to be. Any ideo on how to fix it? My page is http://myanimelist.net/animelist/Gwabanaba

Shishio-kun said:


Find

#list_surround

change margin:auto; to margin: inherit

Gwabanaba said:


Thanks that worked, but also one more thing, the menu button does a weird swoosh and also switches to search instead, how do I fix that lol

Shishio-kun said:


I don't see the same thing you're referring to at all, everything about it looks like its working right on your list.

Gwabanaba said:


I just checked on internet explorer and it's working normal, but I use chrome and it's not. It's nbd though I'm never gonna use that tab anyway lmao.

Shishio-kun said:


yeah Chrome is garbage, but it still works in it you just have to fiddle with it and wait for it to kinda load the menu. It might be fixed in the future if someone takes the time to give it a Chrome fix.

DarknessOfEmo said:
When I used the Bottom left tab menu (fixed top bar options to the bottom), the profile just when a little up than what it looks on the picture. Can you fix this?

Shishio-kun said:


It was designed that way, to make it look similar you'd have to replace the selectors it uses when logged in with ones that only show up when logged out.

I_am_Mika said:
Why do these codes don't work for me? I tried different codes but none of them work on my list :(

I_am_Mika said:
Why do these codes don't work for me? I tried different codes but none of them work on my list :(

Shishio-kun said:


Issue fixed, see the toolbar ur list. any problems later you can report here in this topic. I think it will be ok now tho.

Lichtspiel said:
When I open the original black/grey icon-style top bar link, it just says error :/

Rokumi said:
Works good when I'm logged in and viewing my list, but when I log off and view my list, it looks like this



Any way I can fix this?


It also would be really nice if you could re-upload the Blue Icon bar style.

xbpxsh0cks said:
Hey guys i'm new and i just need some help with something, i want to move my menu either to the left side of my list, or i want to move my picture down so it does not over lap.

Click the bottom spoiler and look at the top right, that's what i'm talking about.

Also not sure if i posted this in the right place it has to do with my menu header so i thought of here.

Shishio-kun said:


Moving the icon bars to the left is a gigantic pain. It'd be easier to just move the list down:

#list_surround {
margin-top: 50px;
}

The more px, the more it moves down!