Forum:Templates look horrible in Monobook

Hey, so I made some templates that look a bit like this:

http://reptiles.wikia.com/wiki/Template:Rewrite

But in Monobook, they're severely messed up:

http://reptiles.wikia.com/wiki/Template:Rewrite?useskin=monobook

Can anyone find a fix for this? Thesaurus Rex 15:56, August 1, 2011 (UTC)


 * It's like that because you specified a few table properties in your Monobook.css. You'll have to remove those, or exempt them specifically on that template.
 * Really? Where are they? I don't remember adding anything that has anything to do with tables into the .css. Thesaurus Rex 16:23, August 1, 2011 (UTC)
 * It's the sixth set from the bottom, with the selector . The background color and border there are why you see your templates weird in Monobook.
 * Okay. Well I removed those, but the alignment of the template is still messed up, and now a part of the template is white. I even did Ctrl+F5 and everything. --Thesaurus Rex 16:41, August 1, 2011 (UTC)
 * It's probably the use of . Instead, put it in the style attribute as , and it should show up.
 * Okay. I just went back to a previous version, after doing what you said didn't work. That fixed the color problem. But my actual problem is the layout of the template itself. It is stretched really far, whereas in the Wikia skin it looks fine. Thesaurus Rex 02:47, August 2, 2011 (UTC)
 * It's a div, so it takes up all the space it can. Since Monobook is significantly wider than Oasis, so it's wider there. If you specify a fixed width, it'll appear that way in both skins.
 * Oh...okay, then. I'm sort of new to the whole coding thing. In the template pages, I have their widths at around 500%. I thought that would give them some kind of fixed width. Can you tell me the right way to do it? Thesaurus Rex 04:06, August 2, 2011 (UTC)
 * Width caps at, because 100% is all of the space it's capable of taking up. Since the space it's capable of taking up scales with the width of what it's inside, percents are a variable width measurement. What you want to use is  , which is pixels.   is always the exact same distance, regardless of page width (or font size). If it helps, the content area in Oasis is 670px, so anything larger and it'll crop your template.

Aar, stupid me, I have no idea where I got the 500% bit from. It's 500px in another part of the template that does not deal in the width of the div. There actually is no div parameter for width. So now I put one up there at 640px, and it works. Thank you for your troubles. Now, I just need to figure out what's wrong with the border, and then try to fix the color. But I think I should address the double border first. Just to make sure there's no mistakes in description, here's the template itself:

 

Thanks a bunch for your help so far, if you can help me now with this confusing bit that would be great. --Thesaurus Rex 01:29, August 3, 2011 (UTC)
 * That template is a mess. :p
 * The border comes from the CSS in MediaWiki:Monobook.css, you have
 * The border comes from the CSS in MediaWiki:Monobook.css, you have

table { background-color: #88dd66; border:1px solid #555544; margin-top: 5px; }
 * That puts a border (and the other 2 things) in every table! Better change it or just remove it.
 * You are complicating that template to the point that if you ever need to change it you will need a week to understand what's there.
 * That template should/could be as simple as this:

 
 * Depending on how many borders you want there and the background colours, you could even remove the div (and put the styles from the div in the table).
 * Most people don't specify widths; when we do, it's only in pixels (px) for the outside element (your div) and for the rest we use percentages. This makes the layout a lot easier to build and if the borders, padding or margins change there will be no need to recalculate the widths. The exception is when we want to put a picture, since pictures have a specific width and height.
 * Also, you should put all the CSS for a table inside a style declaration, outside the style should only be things like colspan and rowspan.
 * Even worse: The bgcolor attribute of is deprecated, and is not supported in HTML 4.01 Strict / XHTML 1.0 Strict DTD.

Use CSS instead.
 * 12:26, August 3, 2011 (UTC)


 * Hmm. Well to be honest, I have no idea why that Table bit was there in the first place. I removed it, that seems to have fixed most of it. Now is there a way to put it in the center? --Thesaurus Rex 00:48, August 6, 2011 (UTC)