❓ Ask for help here + See Frequently Asked Questions

Jordan_X said:


I actually figured it out.



I applied the box-shadow to all table elements within the #list_surround div that didn't have a class, which selected everything I wanted plus the nav bar, so I used this code:

#list_surround table:not([class]) {
box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}

#list_surround table:nth-of-type(1) {
box-shadow: none;
}

fuckhead said:

Thanks that worked well. Do you know how to change the position of it? I tried to use "top:" and "left:" to do it but it just cut off parts of the image instead of moving it. Also in case it affects your answer, I'm using a small picture with a transparent background and added "background-repeat: no-repeat;".

Igneel_Grandine said:
Sorry if this has already been asked but is there a way to get a separate picture to follow beside each section (Watching, Completed, etc.)? Like character 'A' beside Currently Watching, character 'B' beside Completed, character 'C' beside On-Hold, etc.

Yang_Siucao said:

I'm pretty sure it is possible but the method depends on the format. Also I'm still a noob so i won't be much help.

Igneel_Grandine said:


I won't be changing the format of my current list so you can use that as a basis if needed. I'd just like to have a picture follow each section (at the bottom of the screen) as you scroll, but once you get to the end of a section, it stops and follows the section up the screen. I don't know if I explained that well, but I can try to show you what I mean in screenshots if needed.

susan00 said:
Hey, Shishio-kun, got a question concerning the intro animation (I used your Angel Beats animation as basic). When there're more than 100 items on the list it starts
to glitch. Is there any way to solve that?

Yang_Siucao said:
Two questions:
1. Is it possible to resize youtube videos. Like if i wanted to make them bigger to fill up the full width of a profile or smaller to put them side by side. It looks sloppy when things aren't the same size. It would look really cool if you could tile them as well.
2. On my profile i'm having an issue where the top image, two slices, is slightly thiner than the two below it, many slices. I've checked and redone my math countless times but everything always adds up to 800px, there's no transparent edge. All together i'm pretty darn stumped. Any idea where i messed up?

Igneel_Grandine said:
Sorry if this has already been asked but is there a way to get a separate picture to follow beside each section (Watching, Completed, etc.)? Like character 'A' beside Currently Watching, character 'B' beside Completed, character 'C' beside On-Hold, etc.

Igneel_Grandine said:


I won't be changing the format of my current list so you can use that as a basis if needed. I'd just like to have a picture follow each section (at the bottom of the screen) as you scroll, but once you get to the end of a section, it stops and follows the section up the screen. I don't know if I explained that well, but I can try to show you what I mean in screenshots if needed.

Shishio-kun said:


There are many list layouts and CSS tutorials for this kinda thing for classic list designs. You can find them for yourself under the stickies.

For modern, Takana no hana layouts have separate backgrounds and stuff for specific pages. You can get them from there and I just helped someone in this thread Irenevanessa with the same thing. Please try it on your own first if you can, I can help but I'm super burned out on this kinda thing I'd appreciate if you could do it on your own

light_san said:
Hi. Something happened to my list design and I would appreciate some help. As you can see in my profile it asks for some kind of "account update to enable" whatever. I guess something happened to the code, but I have no idea how to fix it. Thx in advance for help.

Pico-tan said:
Consequence of Photobuckets new policies, You will need to re-host the background image on another site.

MilaNympha said:
Hi... Can anyone help me please? I was trying to customize my page for my anime list and when i save it keeps saying "polishing inside screen" but when i click to go on my list its still same. I was always using list codes in 'classic' tab before that. and I tried it in modern tab first time I did everything same as video tutorial but it keeps sayin 'polishing inside screen'. then I used my old CSS codes in classic and it worked. but when i click to 'modern' its still sayin 'polishing..' thing.. What should I do about that?

Shishio-kun said:


What's your signature from? It looks like something I'd like to see.

I might have misunderstood but you can't use classic layout CSS on modern. You need to put modern CSS layouts on the modern tab

It might just be taking a long time to load, try to do it again and give it time. Otherwise I never heard of the problem so I don't have any more advice

Victoren said:
I need some help... c':

Well, basically, I'm trying to combine two layouts in one, but that's the first time I'm messing with CSS stuff, and since I've never touched it before, I'm kinda lost.

The problem is, when I added the second theme, the text in the top where you change your list (currently watching, completed, that stuff) get too far to the right, here's an image: https://i.imgur.com/f6VB2B6.png ("plan to watch" cuts in "plan to"). I want to know if there's any way to get this more to the left? (Also the "tag" keeps appearing, and when I disable it I get a hole in the text, but I'll keep tags enabled anyway)

Second problem is that the other change list thing is covered by RemRam pic, as seem in this image: https://i.imgur.com/9YYe9wA.png (there should be all of them there, but only dropped appear for some reason)
Is there a way to put this text to over the picture without making the picture transparent?

I don't really know if I should be mixing two layouts but I thought it would be fun to experiment with it, and beside those problems, I think it's actually looking pretty good... xD
If there's no way to correct this, no problem, and sorry to ^^

~Edit~
I've managed to fix the first thing, and when I added a little animation intro, RemRam's pic disappeared. That solves the second problem but brings a third, I don't know if that's normal or if there's something wrong in the codes...

ArthurNo1 said:
Hello Just i want the code

how i put image from anime and looks like this http://prntscr.com/fwpbde ? are posible?

ArthurNo1 said:

Yes

Victoren said:
I need some help... c':

Well, basically, I'm trying to combine two layouts in one, but that's the first time I'm messing with CSS stuff, and since I've never touched it before, I'm kinda lost.

The problem is, when I added the second theme, the text in the top where you change your list (currently watching, completed, that stuff) get too far to the right, here's an image: https://i.imgur.com/f6VB2B6.png ("plan to watch" cuts in "plan to"). I want to know if there's any way to get this more to the left? (Also the "tag" keeps appearing, and when I disable it I get a hole in the text, but I'll keep tags enabled anyway)

Second problem is that the other change list thing is covered by RemRam pic, as seem in this image: https://i.imgur.com/9YYe9wA.png (there should be all of them there, but only dropped appear for some reason)
Is there a way to put this text to over the picture without making the picture transparent?

I don't really know if I should be mixing two layouts but I thought it would be fun to experiment with it, and beside those problems, I think it's actually looking pretty good... xD
If there's no way to correct this, no problem, and sorry to ^^

~Edit~
I've managed to fix the first thing, and when I added a little animation intro, RemRam's pic disappeared. That solves the second problem but brings a third, I don't know if that's normal or if there's something wrong in the codes...

Shishio-kun said:


Your post is hard for me to follow. What exactly is the current problem right now that you want solved? You want RemRam's pic back up? Where do you want it - also is that the two girls? When you say RemRam it sounds like one character if so, saying Rem and Ram would be easier to understand for someone who's never seen it

If the two girls: Add to the bottom of CSS; move the pic with left and top px amount. Also please remove @imports you don't need. When you draw on all these you end up adding to the bandwidth use of accounts unnecessarily.

.status-menu-container:before {
position: absolute;
display: block;
content: "";
left: -130px;
top: -444px;
height: 650px;
width: 1000px;
background-color: transparent;
background-image: url(http://i.imgur.com/tU8xou7.png);
background-position: center top;
background-attachment: scroll;
background-repeat: no-repeat;
z-index: 1;
pointer-events: none;
}

Valerio_Lyndon said:
Well, if you are using two layouts at once simply by copy-pasting one after another, you will definitely have some conflicting CSS. I would highly recommend not doing this, and instead, taking one thing you like at a time from each theme and slowly building up a new theme from the pieces of the two. This would make your code a million times cleaner, thus reducing page load¹ and making it easier to fix issues as they pop up while inserting each new snippet. It'd likely take about as much time as it will take to get your current theme working properly anyway.

I won't go into the specifics of how to fix your current issues here (though I can in another post if you want), as to fix every issue on your current list style you will need to learn how to fix them anyway to get this up and running. You can check what is causing things to become faulty by inspecting the elements individual properties and finding the piece of code that is causing them to act the way they do (I think Shishio has a tutorial on Inspect Element, or I guess I could explain it), then finding that specific line of code in your theme mash-up and modifying it. That's the best way to go about fixing your issues.

¹ What I mean by reducing page load is that as of right now, you are loading not only two versions of code for each element on your list, which means double the text being sent to each visitor (this only amount to a few kilobytes though), you are also sending quite a few images that will never be seen to each visitor as well (this is a lot more egregious). What this means is that you're wasting the bandwidth of anyone who visits your anime list, and may increase your page load time by up to a second or more, depending on the speed of the visitor's internet connection.

Victoren said:


Yeah, you have a great point... I think I'll stop with the laziness and start everything from zero.
As I said, until yesterday I hadn't tried to mess with CSS code not even once, I was pretty lost, but I think I can get this to work now as I have read some tutorials, and for the time I spent messing with the codes and trying to find the things that was causing issues (exactly as you said lol).
So thanks for the advice, I'll blank everything and try to start from zero. ^^

Valerio_Lyndon said:
Cool. :3

Feel free to ask if you are wondering about anything as you do so, those themes had some complicated stuff in them from what I saw.

blob said:


Hi again,

I'd like an update on this issue I'm having (see above spoiler). I'm unsure if no one answered because it's an unsolved mystery I missed the link of or if it's because you guys think this is the same issue is addressed on the first post of this topic (and other places) and it feels like I didn't try solving it that way (it still might be, but I have investigated further as you will be able to read soon).

I checked other people's lists and it seems to happen for everyone's list, so I now know that it is not related to my code; it was also weird that the MAL page itself didn't have the images as complete. (In case anyone saw and went like : "Damn it blob, you don't listen to instructions!" : )
I tried on a different browser (on Mozilla FF) and the images were fine. I then tried on a different computer with the same browser (Chrome) and the images were all there. I thought it was my adblocker, so I turned it off, but it didn't solve the problem on Chrome. So I'm perhaps even more confused to before.

Another confusing element is how I can see the miniature covers of the MAL site before they disappear once I click on them :

Hopefully this addition of information will help.
Thanks in advance.

Valerio_Lyndon said:
From what I see no one answered your post, whoops. So I see you are using the correct import format for the issue everyone else was having, and I can see everything fine while using the problem-child version of Chrome. So that's very odd, especially as it also is happening for every list you say... And if the base website image are also being affected in some way, assuming these issues are being caused by the same problem, this is probably some really weird bug. May need a reinstall of Chrome or just to use Firefox until Chrome decides to update on your machine. But in the mean time, we can try some troubleshooting though I kind of doubt results ( sorry for the pessimism ;3 ).

Alright, firstly, could you check your browser version by putting chrome://help/ into the URL bar and tell us what it says please.
Also, have you enabled any experimental flags in Chrome (if you don't know what they are just say no)?
Do you have any issues with images on other websites, or is it only MAL that loads half the image?

Cazador75 said:
Hey, I'd like to have my Currently Watching table (only that table) sorted by the Tags column alphabetically (instead of being sorted by Anime Title).

What code would I need to achieve this? I'm using the classic style without any premade style, just some minor adjustments I already made.

Actually, what I really want is to sort it by emission day, so I just figured I'd put the day as a tag and then sort by that column.

blob said:


...Thanks for no-noticing me, senpai...

I haven't tested out every list; in fact, yours seems to be working just fine, even if once I click on the cover, the MAL page it redirects me to will have a faulty cover image. It also has no problem on modern list layouts.


Idk what experimental flags are, so no?

Unsure, I don't know many image websites. I'd say only MAL, but if you got examples I could try (imgur/facebook are fine).


I won't change browser for simply this. :T

Valerio_Lyndon said:
Yeah, I use default images instead of a cover generator (as do most modern lists). All classic lists use CSS to import covers into their list designs, which would appear to single out that as one of the issues happening here.

You could try disabling all your chrome extensions and seeing if that changes anything?
And maybe clear your cache? chrome://settings/clearBrowserData (make sure to only check "cached images and files", unless you actually do want to clear everything else)
(You could also check if the images change at all in an Incognito window, though that's kind of grasping at straws.)

Short of that, I would recommend re-installing except that re-installing chrome without losing settings is a right pain.

This is such a strange issue to be honest all I can think of is basic troubleshooting (though I can't think of any more of troubleshooting steps at the moment). The fact that images only load weirdly on MAL anime pages is especially annoying. We have the same Chrome version so it's definitely a bug with your specific install/setup though..

Kano said:
Just a quick question. Is there a limit as to how many characters you can put in your css code?

Kano said:
Just a quick question. Is there a limit as to how many characters you can put in your css code?

blob said:
Interesting, everything is now fixed, thanks. =)

I first tried opening on another computer with the same setup and the images were showing. So I was a bit confused. I tried on the computer with the problem to open an incognito tab and it was also working. I disabled every extension one by one and that didn't work (I later tried to disable all, still no success).

The problem was finally solved once I cleared cached images and and files as well as download history (my bad, should have tried only one at once).

What could have been causing such a weird bug? Too much memory stored or something? I had 640 MB of cached data; feels like once I use Internet for another week, the issue might come back. Luckily I didn't need to reinstall anything and lose stuff.

A_wild_jet said:
Hello :D was wondering if anyone could help me out ~ I'm not the best designer but I put something together and thought it looked okay. But now I can't get it in the right order on my profile - I've done layouts before so I'm sure I have the right sizing and order of the images but I'm most likely just performing a stupid mistake.

Thanks ~
(If needed I can post an image of what it should look like)

EDIT: I think its down to the guillotine went odd on gimp, now that I have the images through Imgur won't upload them for some reason...

Valerio_Lyndon said:
A visualization of what you want it to look like would help, yeah. (are you thinking something like this?)

But I am pretty sure this is a case of your images being too big. Also, if you don't plan on wrapping any of the images in links, it might be easier to just have one image for the whole profile.

A_wild_jet said:


Yes, that's exactly what I'm going for :D, the part at the bottom is a gif though, at first I was also going to add other links but I decided against that and thought I would keep it simple :)

Sorry for the late responce :/

Valerio_Lyndon said:
It's all good, no need to worry about responding late. So all you really need to do is to make it so the total width of the images is not above either:
• 798 pixels if you are using one image spanning the entire width of your profile.
• 800 pixels if you are using multiple images (or you can just do 798 pixels like a single).

If you want them here are some resized links that should work (they aren't exactly 1:1 ratio's but I think they still look fine).
1 2 3 4
The gif is the same file as you already are using so no worries there (anything I could have done to it would have messed it up slightly, gifs are finnicky). I would advise downloading and rehosting the images as I may end up deleting these from my own Imgur account at any time.

This is what the resizes look like fitted together: http://i.imgur.com/hHL2YM4.png

Shishio-kun said:


idk but there was a point where it will load slowly with too many characters

Kanna said:
Hello. I'm new in this layout stuff and i watched your explanation video. Thanks for your tutorials in particular @Shishio-kun!
But when i tried to customize my layout, it doesn't show up. Can somebody help me maybe?

I found dear @nymphiae's minimalist layouts and loved them, but when i copy-paste her codes, they doesn't show up in my list at all. What did i do wrong?

1. I visited nymphiae's portfolio for myanimelist-layouts here✿
2. I choosed one layout i prefered (this one) and clicked on 'code', it brings me to this page: >>here.
3. I followed the link that says 'import', brings me here to this page.
4. I copy pasted the whole site (one times with credits header and one time without, just in case), but none of the versions shows up. It only changes the background color to pink and the credits appear on the end of the list (copyright etc.)

Did i do something wrong or does the code doesn't work anymore? Does anybody still has the code? I just wanna use it and modify the colors (from pink to another if possible), but it doesn't show up in the first place. help?