New
Jan 16, 2015 6:32 AM
#301
Jan 16, 2015 6:39 AM
#302
Jan 16, 2015 6:52 AM
#303
Are you sure the image is alive or you haven't made a mistake on the syntax like missing brackets, apostrophe or quotes while editing the said css? |
Jan 16, 2015 7:12 AM
#305
There actually a recent problem with "img" so any images from profile may have technical issues. It's probably related. "IMG BBcode Temporarily Down" http://myanimelist.net/forum/?topicid=1341369 |
Jan 16, 2015 9:55 AM
#307
@Arkloy: Wow many problems with that code. The import link you're using links to a layout source, but it isn't a valid CSS link so it can't be used on lists unless you edit it a certain way or rip the CSS from its source. And the image they hosted in their background for the list wasn't a valid image link either. The source also has a lot of extra codes that shouldn't be in there, and missing codes for covers and top bar which its set up for. I've extracted the codes from the source which you need and fixed them to make the layout and covers/background image its linking to/top bar appear again, and I removed the non-CSS codes. Just add these to your CSS edit box after you completely clear it. /*Fonts*/ @import "http://fonts.googleapis.com/css?family=Carrois+Gothic+SC"; /*Covers*/ @import "https://dl.dropboxusercontent.com/u/49469857/MAL/premade/anime.css"; /*Topbar*/ @import url(http://storage.live.com/items/4A07C1EEED420167%21162); /*Background*/ body { background-image: url(http://i.imgur.com/mb1EEfg.jpg); background-attachment: fixed; background-size: cover; } /*Header*/ .header_title { color: #FFFFFF; font-family: 'Carrois Gothic SC', sans-serif; font-size:30px; font-weight: 700; border-radius: 20px 20px 0px 0px; text-align: center; text-shadow: 1px 1px 1px #000000; } /*List width*/ #list_surround { width:1000px } /*List position*/ #list_surround{ left: 150px; position: relative; } /*Background colour and opacity*/ .header_title, .table_header, .category_totals, .td1, .td2, #grand_totals, #copyright { background: rgba(0, 81, 212, 0.2) !important; } /*Font*/ .td1, .td2, a, a:visited, .category_totals, .table_header, #grand_totals, #copyright { color:white; font-size:16px; font-family: 'Carrois Gothic SC', sans-serif; text-shadow: 2px 1px 2px #000000; text-decoration: none; } /*Column sizing*/ td:nth-of-type(1){ width: 40px; } td:nth-of-type(3){ width: 60px; } td:nth-of-type(4){ width: 75px; } td:nth-of-type(5){ width: 80px; } /*Bottom 2 boxs*/ #copyright { margin-bottom: 30px !important; border-radius: 20px; padding: 10px; } #grand_totals { text-align: center; margin:0 auto; border-radius: 20px; padding: 10px 20px; width: 600px; } /*Bottom of each list totals*/ .category_totals { border-radius: 0px 0px 20px 20px; height: 40px; text-align: center; } /*Panel*/ .hide { background-size: cover; left: -132px; vertical-align: 50%; height: 176px; width: 114px; padding-bottom: 0px; border-style: solid; border-color: white; border-top: 1px solid white;; border-left: 1px solid white; border-right: 1px solid white; border-bottom: 1px solid white; border-radius: 25px 25px 25px 25px; background-color: rgba(200, 5, 200, 0.75); background-position: center 50% !important; background-repeat: no-repeat !Important; display: block !important; position: absolute; visibility: hidden; opacity: 0; } /*Centre panel to line*/ .hide { -ms-transform: translateY(-78px); /* IE 9 */ -webkit-transform: translateY(-78px); /* Chrome, Safari, Opera */ transform: translateY(-78px); } /* Show panel when name hovered over */ :hover + .hide { visibility: visible; opacity: 1; } /* Silver highlight and font resize on Hover */ tr:hover [class^="td"] { background-color: rgba(72, 64, 87, 0.6) !important; } btw the source code you're using has a different image than that user you linked to, AnimeBazooka's background image is: https://i.imgur.com/2e61QCd.jpg You can replace the link in parenthesis after /*Background*/ body { background-image: url with that link to get his background instead of what was in the source code. He also removed his top bar on his own list, but the source says its set up for a custom icon top bar (which I fixed it for). But if you want to remove the top bar like his find and use my tutorial on removing the top bar, all top bar codes here: http://myanimelist.net/forum/?topicid=449097 btw images are missing from the forum you can use our script to see the image previews again: http://myanimelist.net/forum/?topicid=1341463 Luna_slave_No61 said: Your list CSS can't consist only of a single @import link, you must add there some other lines, at least one Arkloy said: Like what? It was just the @import link and it worked before. Luna_slave meant you needed to add some normal CSS code like {} after the import link, like: @import "https://www.dropbox.com/s/hb5rk8b4yaofexv/MAL.css?dl=0"; {} normally this fixes imported CSS problems when the import link is a valid direct link to a source code, but the import link in this case is not. mbdsquad said: There actually a recent problem with "img" so any images from profile may have technical issues. It's probably related. "IMG BBcode Temporarily Down" http://myanimelist.net/forum/?topicid=1341369 No its not related to that, CSS on lists isn't affected by this problem. So the images in layouts aren't affected. It is possible to use BBcode on your lists, but almost no one does this everyone uses CSS for images instead. I see images on everyone else's list and tested the codes in the spoiler on my own and it shows the images just fine. |
Jan 17, 2015 6:53 AM
#308
Alright, thanks for all your work, I appreciate it! I just started learning CSS and Webdesign and I'm still having a hard time figuring everything out. Just one more question, any idea how I get the @import link now? It used to work using the share link from dropbox, but the link itself was way different then. |
May 2, 2015 1:24 PM
#310
I've tried to made the rows for my lists transparent, and I've made my opacity 0. But I still cannot see my image through my list? Also, my wallpaper settings are set to 'No-repeat' and 'fixed' but are still scrolling with the page and are tiled despite that. I'm not using CSS but instead editing using the 'Edit my style' settings. Could someone please help? I'd hate to resort to CSS to fix my problems since I have no knowledge on CSS at all. |
May 14, 2015 11:17 AM
#311
Not quite sure how to do it in the editor, but: Hollow-Oak said: I've tried to made the rows for my lists transparent, and I've made my opacity 0. But I still cannot see my image through my list? Line 66 - replace: background-color: #464646; with: background: rgba(70, 70, 70, 0.6); Line 81 - replace: background-color: #5A5A5A; with: background: rgba(90, 90, 90, 0.6); Hollow-Oak said: Also, my wallpaper settings are set to 'No-repeat' and 'fixed' but are still scrolling with the page and are tiled despite that. I'm not using CSS but instead editing using the 'Edit my style' settings. Line 14 - replace: background-image: url(http://myanimelist.net/images/userwalls/3745731.jpg); background-attachment: ; background-repeat: ; background-position: ; with: background: url("http://myanimelist.net/images/userwalls/3745731.jpg") no-repeat top / cover fixed #000; Line 19 - delete: background-color: #000000; |
Jul 26, 2015 3:31 AM
#312
Hello, I was wondering how I can link the pictures of each anime/manga on my list, any ideas please ? Thank youu :3 |
Jul 27, 2015 8:15 PM
#313
roaki said: Hello, I was wondering how I can link the pictures of each anime/manga on my list, any ideas please ? Thank youu :3 "Linking" the pictures can mean a lot of things but I think you just want to display covers, you can add any of these set-ups to your custom CSS: http://myanimelist.net/forum/?topicid=1162203 |
Aug 4, 2015 6:55 AM
#314
How do i put list to the right side? Yes, i added this code: #list_surround { position: absolute !important; right: 1px !important;} But not the whole list is on the right side. How do i fix that? Mod Edit: Put thread title in post so it's clear what this is about after merging. |
LunaAug 7, 2015 12:32 AM
Aug 4, 2015 7:41 AM
#315
Minecraft11 said: But not the whole list is on the right side. How do i fix that? What do you mean by "the whole list"? If you mean that the top bar stays at the centre, maybe something like this will work: #mal\_control\_strip { position: absolute !important; right: 1px !important;} Or better ask in this club: http://myanimelist.net/clubs.php?cid=19736 |
SerhiykoAug 4, 2015 7:47 AM
Aug 16, 2015 8:45 PM
#317
Hi! I have a little problem with my anime list, and I'm hoping someone more well-versed in MAL's CSS than I can assist. I got my list CSS from a user who posted theirs on Reddit, and it works great except for one thing: when you click "More" on any list entry, the information that comes up does not have any line breaks. It's all one continuous stream of text, which is hard to read. I'm assuming this is a CSS error since the default list layout doesn't have this issue. Any help would be very much appreciated. Thank you for your time! :D |
Aug 17, 2015 6:16 AM
#318
codedeeply said: ... when you click "More" on any list entry, the information that comes up does not have any line breaks... Add this line to your CSS somewhere: .borderRBL br {display: block !important;} codedeeply said: I'm assuming this is a CSS error since the default list layout doesn't have this issue. It's not, the creator of the CSS put #list_surround br {display: none;} intentionally. cheers o/ |
sedaleareAug 17, 2015 6:27 AM
Aug 17, 2015 8:27 AM
#319
Thanks, sedaleare! Worked like a charm. |
Aug 17, 2015 8:38 AM
#320
You're welcome. Come to think of it, there is a more elegant solution. Change line 32 from: #list_surround br to: #list_surround > br then delete .borderRBL br {display: block !important;} cheers o/ |
Aug 22, 2015 6:24 PM
#321
Hey guys, i made a post for list design help, and help on my signiture, if anyone here can help me that would be great. I already got the signiture part fixed, but could use help on the list design. http://myanimelist.net/forum/?topicid=1420251 |
"Make it flashier!" -Maid Chou Anime List |
Aug 29, 2015 10:12 PM
#322
join this club - http://myanimelist.net/clubs.php?cid=19736 its a very helpful club for everything MAL customization, i learned CSS editing there too |
Aug 29, 2015 11:00 PM
#323
HighKing77 said: If you go on my list, you can see that the scores that I've given don't exactly line up for some anime, so they look wonky. You can notice this between animes 7 - 11 on my completed section. It looks fine though. Could you give a screenshot? |
Haters always gonna hate. But they are all dumb asses who always love to bother unnecessarily. "Spread the Hate, Spread the Idiocy." |
Aug 30, 2015 12:31 AM
#324
Aug 30, 2015 7:21 AM
#325
Yes indeed. Seriously change or update your stupid browser m8. |
Haters always gonna hate. But they are all dumb asses who always love to bother unnecessarily. "Spread the Hate, Spread the Idiocy." |
Aug 30, 2015 11:32 AM
#326
HighKing77 said: Really? This is how it looks normally: The problem only arises when I hover: Replacing #copyright:HOVER {background-color:black; border-width:0; with #copyright:HOVER {background-color:black; border-width:1; seems to fix the issue. If not, you better wait for a reply in that club |
SerhiykoAug 30, 2015 11:43 AM
Oct 6, 2015 2:58 PM
#328
Here's my list right now for reference: http://myanimelist.net/animelist/shiningtriforce I don't know much about CSS but I've managed to get this mostly how I want it following some tutorials on the MAL forums. When you hover over a title (see Akagami no Shirayuki-hime on my list), it will show a small review area under the title picture. Right now it seems like I'm running into the character limit for tags or something, since the word "Enjoyment" was cut short and now appears as "Enjo" in the tag itself. Is there a way to extend the allotted tag length? OR Is there a way to put the text from the "Comments" box (seen when editing a title) there instead? Any help is hugely appreciated |
Oct 7, 2015 10:42 PM
#329
I couldn't find a definitive answer to my question on any of the site and asking got an auto reply from what I am assuming was a bot to this thread. Am I allowed to make a background of just font of "boobs" or "butts" repeating over and over got my list? I wanted to ask beforehand so my account wouldn't be penalized. |
Nov 9, 2015 7:41 PM
#330
Hello everyone, I recently customized a premade template. Sadly I know very little about CSS and when I noticed that my "Score", "Type", and "Progress" headers did not match their respective columns I had no idea how to fix it. Any help would be appreciated thanks! |
Nov 9, 2015 8:52 PM
#331
Nothin99 said: Hello everyone, I recently customized a premade template. Sadly I know very little about CSS and when I noticed that my "Score", "Type", and "Progress" headers did not match their respective columns I had no idea how to fix it. Any help would be appreciated thanks! Try this: td.td1[width="125"][align="left"], td.td2[width="125"][align="left"] { display: none; } |
Nov 12, 2015 7:24 PM
#332
Metricx said: Nothin99 said: Hello everyone, I recently customized a premade template. Sadly I know very little about CSS and when I noticed that my "Score", "Type", and "Progress" headers did not match their respective columns I had no idea how to fix it. Any help would be appreciated thanks! Try this: td.td1[width="125"][align="left"], td.td2[width="125"][align="left"] { display: none; } Thank you so much! |
Jan 3, 2016 3:52 AM
#333
I would like some help with my anime list design. I just wanted to know how to make the table transparent, so that the background is seen a bit. I haven't taken up CSS, so I don't know where to start in searching for the solution. Here's what my list looks like right now: http://myanimelist.net/animelist/Arcanon Here's the code that I'm using (courtesy of agersant): @import url(http://fonts.googleapis.com/css?family=Roboto:400,300,500); @import url(http://fonts.googleapis.com/css?family=Alegreya+Sans+SC:800); /*Links*/ [href] { text-decoration: none; color: #C4573F; } [href]:hover { color: #9ac714; } /*Main container*/ #list_surround { position: relative; background-image: url('http://i.imgur.com/sMy4p2k.jpg'); background-repeat: no-repeat; background-position: 0px 0px; background-size: cover; background-attachment: fixed; font-family: "Roboto", "Arial"; font-size: 16px; } /*Hide navigation (menu for Watching, Completed, etc.)*/ [class^=status_] { display: none; } /*Hide stats*/ #grand_totals, .category_totals { display: none; } /*Position list*/ #list_surround [cellpadding="0"] { width: 700px; left: 10%; position: relative; } /*Categories (Watching, Completed, etc.)*/ [class^=header_] { margin-right: 100%; margin-top: 10px; white-space: nowrap; } .header_title { color: #655050; font-family: "Alegreya Sans SC", "Arial"; font-size: 32px; font-weight: 800; padding: 10px 0 0; } /*Column headers*/ .table_header { padding: 8px 8px 0px 8px; } .table_headerLink { color: #e29a8d; font-size: 12px; font-weight: 300; } /*Rows*/ .td1 { background-color: #a873e3; } .td2 { background-color: #9d6bd5; border-top: 1px solid #000000; border-bottom: 1px solid #000000; } .td2:first-child { border-left: 1px solid #000000; } .td2:last-child { border-right: 1px solid #000000; } .td1, .td2 { padding: 8px; } .td1, .td2, .animetitle { color: #f4af89; font-size: 13px; } [id^="scor"] { color: #f4af89; } /*Add/Edit - More*/ [style^="float: right"] { } /*Copyright*/ #copyright { font-size: 12px; font-weight: 300; padding-top: 60px; margin-bottom: 30px; } Thanks in advance! |
Jan 3, 2016 4:31 AM
#334
Play around with background: rgba(x,x,x,0-1) Where RGB (x,x,x) stands for the value of Red, Green and Blue and the A value stands for the color transparency.Alternatively, you may use background: none transparent to get rid of the backgroundTry using the functions above in the following classes .td1{} .td2{} #list_surround{} |
Jan 3, 2016 9:25 AM
#335
Thread merged from Support. |
Jan 3, 2016 9:33 AM
#336
Recuvan said: Play around with background: rgba(x,x,x,0-1) Where RGB (x,x,x) stands for the value of Red, Green and Blue and the A value stands for the color transparency.Alternatively, you may use background: none transparent to get rid of the backgroundTry using the functions above in the following classes .td1{} .td2{} #list_surround{} It worked. Thanks, Recuvan. |
Jan 3, 2016 4:26 PM
#337
So before Halloween, my anime list had a black translucent background for the list itself--to make the white text easier to see. I don't know if the jumpscares had anything to do with it, but after Halloween, the black translucent background disappeared. I hadn't been messing around with my CSS at all. Could someone take a look at my CSS and figure out what's going on? I apologize if this was the wrong forum to post this in. I assume if it is not the right one than the Creative Corner should be where I ought to pose the question, and I'll do so accordingly. ----- @import url(https://googledrive.com/host/0BxjwQr0BBXs-MVlzYkRVc0k0Q0k); #copyright, #grand_totals { text-align: center; } #copyright:after { content: " Created with the help of Shishio's tutorials. (Tutorials can be found by googling Shishio's Custom Lists). Thanks so much to Annuvin for the advice and cleanup!"; } #list_surround { margin: 0 auto; width: 800px; } .animetitle, .status_not_selected a { color: white; } .animetitle { transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out; } .animetitle:before { background-size: contain; content: ""; display: inline-block; height: 0; margin-left: 0; margin-top: 10px; position: absolute; transition: all .4s ease-in-out; -webkit-transition: all .4s ease-in-out; width: 0; } .category_totals { height: 30px; } .category_totals, [class^="td"], #grand_totals, #copyright { background: url('http://img15.imageshack.us/img15/228/frame6518.png'); border-width: 0; padding: 2px; } .header_title { background: black; color: white; height: 52px; padding: 2px; text-align: center; font-size: 20px; font-weight: bold; } .status_not_selected { background: black; color: white; padding: 2px; } .status_selected { background: black; color: white; padding: 2px; text-decoration: blink; } .status_selected a { color: pink; } .table_header { background: black; border-width: 0; font-weight: 700; padding: 2px; } [class^="td"], a, .category_totals, .table_header, #grand_totals, #copyright { color: white; } [class^="td"]:nth-of-type(6), .table_header:nth-of-type(6) { width: 300px; font-size: 12px; } .thickbox { color: pink; font-size: 12px; } a { text-decoration: none; } a:hover { color: pink; text-decoration: underline; } body { background: black url(http://i.imgur.com/CbG4nKV.jpg) no-repeat center fixed; background-size: cover; font-family: Helvetica, Verdana, sans-serif; font-size: 14px; } { transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out; } tr:hover { background: black; } tr:hover .animetitle { letter-spacing: 1px; } tr:hover .animetitle:before { background-repeat: no-repeat; background-size: cover; border-bottom-left-radius: 7px; border-bottom-right-radius: 7px; border-top-left-radius: 7px; border-top-right-radius: 7px; box-shadow: rgba(63,52,60,0.55) 0 0 8px 8px; content: ""; margin-left: -250px; margin-top: 10px; padding-right: 220px; padding-top: 290px; position: absolute; z-index: 1; } |
Read the Baccano! LNs. If you have any questions about Baccano! (anime/manga/LNs) feel free to PM me. Or the Naritaverse in general (note: I am least knowledgeable about Drrr!!). I am an admin of the Baccano! Wiki. The wiki also has an official Twitter where we share Baccano! news and wiki updates. I have recently founded two wikis: one for Etsusa Bridge and one for Vamp!. I welcome all suggestions. |
Jan 3, 2016 6:28 PM
#338
Jump scares had nothing to do with it I can see the translucent background on your list fine. The image link that causes the translucent background is hosted on Imageshack, and I guess they changed something and blocked you somehow from seeing it: http://img15.imageshack.us/img15/228/frame6518.png You should swipe that link in your layout with this image link (same pic just rehosted): http://i.imgur.com/rznyCTn.png btw if I ctrl F5 your list I see the problem you mention, then if I click the Imageshack link, see the image, then refresh your list, I see the list table as its supposed to look. However you should still change the imgur link |
Jan 3, 2016 6:35 PM
#339
Well, frankly I didn't hold too much stock in the idea that it was the jumpscares that did it, but I swear the change happened at Halloween, so I couldn't help but immediately connect the two. Can't believe I didn't think to replace the image link though. That's embarrassing. Thanks for the new link; I can see it fine now. I had no idea it was still visible to others--that's a relief. |
GallimaufryJan 3, 2016 6:49 PM
Read the Baccano! LNs. If you have any questions about Baccano! (anime/manga/LNs) feel free to PM me. Or the Naritaverse in general (note: I am least knowledgeable about Drrr!!). I am an admin of the Baccano! Wiki. The wiki also has an official Twitter where we share Baccano! news and wiki updates. I have recently founded two wikis: one for Etsusa Bridge and one for Vamp!. I welcome all suggestions. |
Jan 5, 2016 6:05 PM
#340
Can someone help me fix my list http://myanimelist.net/animelist/AnimeFreak0_0 |
Jan 5, 2016 11:38 PM
#341
Thread "Help me please" Merged Here. |
~ S & F Guidelines ~ My Profile ~ My AnimeList / MangaList ~ ShawnOfTheDeadz.com ~ |
Jan 6, 2016 4:15 PM
#342
You didn't specify a problem, so I'm going to assume its because all the categories are on one page. It has recommended settings where you're supposed to have it on one category page at a time: Go to this page and find Default Status Selected under Anime List Settings (or Manga List Settings for manga lists). http://myanimelist.net/editprofile.php?go=listpreferences Change default status to a category other than Show All, like Watching or Completed. This way, your list only loads one category at a time on default, rather than all. |
Jan 6, 2016 4:33 PM
#343
Hello, is there a way to center the search box on the x-axis in CSS? /* SEARCH */ #search { position: absolute; top: 250px; right: 50% !important; transform: translate(-50%, 0) !important; } Perhaps it's impossible to center it or it is the wrong class I'm trying to edit... |
removed-userJan 7, 2016 8:39 AM
Jan 7, 2016 8:38 AM
#344
Is it possible to put something ::before or ::after the headers in the table? Actual result: Expected result: Coding used: [class^="header_"] * { font-size: 0px; line-height: 0px; padding-bottom: 150px; } #list_surround .header_cw:before { content: ""; background:url(http://phototive.com/uploads/327/24956/ti1xyvgvw1oiclz5.png) no-repeat scroll center top; position: absolute; width: 100%; height: 100%; } FIXED //EDIT: FIX - instead of using the before and after function I've used div{ on the elementposition:absolute; margin:-200px, 0px, 0px, 0px; z-index: -20; } |
removed-userJan 7, 2016 8:53 AM
Jan 8, 2016 2:30 AM
#345
Jan 11, 2016 9:15 AM
#346
Hi. Is it possible to make the background image scroll with the list until the lower edge of the image is reached, and then it stays fixed with any further scrolling? I know it was like that at some point but didn't get around to asking how to fix it when it changed :/ I have: background-attachment: scroll; background-repeat: no-repeat; background-size: cover; Is there something I can add so the image will stay fixed when the lower edge is reached? |
Jan 11, 2016 9:35 AM
#347
There are some threads in creative corner and clubs. This is what an author of my css put in. body { background: url(http://images.8tracks.com/cover/i/009/016/320/43658_anime_scenery_tree_swing-5684.jpg) center !important; background-attachment: fixed !important; background-repeat: repeat !important; background-position: cover !important; background-size: cover !important; } |
Jan 11, 2016 12:35 PM
#348
As far as I'm concerned, this would require the use of Javascript. However, as ExTamplier said, you can set your background as fixed and let it scroll with the pagebody {background: url(http://i140.photobucket.com/albums/r39/Scenice/One%20Piece/One_Piece_2010_by_ryoyami_zpse93d435b.png) center !important; background-attachment: fixed !important; background-repeat: repeat !important; background-position: cover !important; background-size: cover !important;} To make it look nice, you'd need to crop your background using the 16:9 ratio though. |
removed-userJan 13, 2016 9:11 AM
Jan 12, 2016 11:11 AM
#349
Thank you for the replies :) I'll try fiddling around with it and see what I like best |
Jan 12, 2016 1:59 PM
#350
How do I make my list look like this? http://myanimelist.net/animelist/Nagirah |
More topics from this board
» I made a Browser Extension that let you watch anime from MyAnimeList and moreKuronekoNy4n - 9 hours ago |
0 |
by KuronekoNy4n
»»
9 hours ago |
|
» Forum setsSweetIcedMocha - Yesterday |
0 |
by SweetIcedMocha
»»
Yesterday, 7:53 PM |
|
» colourful modern list (adapted from Clarity)sunnysummerday - Oct 14 |
4 |
by sunnysummerday
»»
Yesterday, 2:17 PM |
|
» Sakura Kinomoto ♥ Happy HalloweenMasterTasuke - Yesterday |
0 |
by MasterTasuke
»»
Yesterday, 6:35 AM |
|
» I made a Guess the Anime Opening Mobile AppPortega - Oct 15 |
0 |
by Portega
»»
Oct 15, 10:31 PM |