MediaWiki talk:Standard.css

From Wikipedia, the free encyclopedia

This interface message is documented on its manual page.
The page forms part of the MediaWiki interface, and can only be edited by administrators. To request a change to the page, add {{editprotected}} to this page, followed by a description of your request.
Notice

All the stylesheets are documented at the catalogue of CSS classes. Please add any new classes into that catalogue.

Contents

[edit] Crissov's proposals

user:Crissov proposes the following additions.

[edit] Table-like definition lists

Has problems in IE.

dl {line-height: 1.2;}
dt, dd {border-top: 0.1em solid gray; margin: 0.2em 0; padding: 0.2em 2.25%;}
dt {width: 20%; font-weight: bolder}
dd {width: 70% /*<= 100-25-2·2.25*/; margin-left: 25% /*>= 20+2·2.25*/;
       margin-top: -2.0em;}
dt+dd {margin-top: -1.9em} /* That is the negative value of
    line-height(dd) + padding-top(dd) + border-top-width(dd) +
  + margin-bottom(dt) + border-bottom-width(dt) + padding-bottom(dt)
  = 1.2em + 0.2em + 0.1em + 0.2em + 0.0em + 0.2em = 1.9em */
dd:first-child,
dd+dd {margin-top: 0}

/* Make Talk pages with long, nested discussion better readable: */
dl dl dt {width: 5%; padding: 0.2em 1%}
dl dl dd {width: 87.5% /*<= 100-7.5-2·2.25*/; margin-left: 7.5% /*>= 5+2·1*/;}

[edit] Nicer tables

table {
  border-collapse: collapse; /* incl. border-spacing: 0;*/ border-style: solid;
  margin: 1em; padding: 0.25ex; font-size: 100%;
}
table[align="right"], table.right  {margin-right: 0}
table[align="left"],  table.left   {margin-left:  0}
table[align="center"], table.center{margin-right: auto; margin-left: auto;}

/* caption */
caption {font-weight: bold; font-size: large; background: #DDD; color: #000}

/* borders */
tr {border-top: thin solid;}
th {border:     thin solid;}
/* no vertical borders between data cells */

/* cells */
th, td {
  vertical-align: top; text-align: left; text-align: ",";
  min-height: 1em; padding: 0.25em;
  font-size: 100%;
}

/* row and column headers, works well for most tables */
@media screen, projection {
 tr:first-child>th,
 tr>th:first-child {background-color: silver; color: black;}
}
tr:first-child>th {text-align: center;} /* column headers */
tr>th:first-child {text-align: left;}   /* row headers */

/* highlight row on mouse-over */
#article tbody>tr:hover,
#article tbody>tr:hover>* {
  background-color: silver; color: black;
} /* diff tables should be excluded */

[edit] Enhanced readability etc.

p, dt, dd, li, td, th, address, blockquote {
  min-width: 6ex; max-width: 80ex;
}
sup, sub {line-height: 0.1em; font-size: 1ex;}

[align]+* {clear: both}

pre {
  white-space: pre-wrap /* CSS 2.1 */;
  font: 95%/1.15 monospace;
  background: #CDE; color: #000;
}

code {color: navy}
var  {color: green}

:link:hover, :visited:hover {color: blue; text-decoration: underline}

textarea,       input[text]       {background-color: #EEE}
textarea:focus, input[text]:focus {background-color: #FFF}

#topbar, #footer, #quickbar {font-size: smaller}
#article                    {font-size: medium}

[edit] Enhanced printing

@media projection, print {
 h1, h2, h3, h4, h5, h6, table {
   page-break-before: always;
   page-break-after:  avoid;
 }
 h1+h2, h2+h3, h3+h4, h4+h5, h5+h6,
 h1+table, h2+table, h3+table, h4+table, h5+table, h6+table {
   page-break-before: avoid;
 }
 ul, ol, dl {
   page-break-inside: avoid;
 }
 p, li, blockquote {
   page-break-inside: avoid;
 }

 .subtitle {display: none}
}

[edit] No Quickbar while editing

     body[onload]    #quickbar {display: none !important}
html body[onload=""] #quickbar {display: block !important}
I don't think we should put this in the standard stylesheet. I often use the quickbar while editing (for example, it'll use the history or view article/view project page link and open it in another tab. -- Finlay McWalter | Talk 15:23, August 5, 2005 (UTC)

[edit] Fixing image layout incompatibilities

Monobook (which, let's face it, almost everyone seems to use, and which 99% of visitors inevitably use) handles the following (very common) markup differently from classic:

  
 [[image:foo]]
 [[image:bar]]

Monobook lays out the two images with one above the other. Classic lays them out differently, with the two beside (horizontally) one another (or sometimes does fairly horrible things, on a congested page). While we could argue which is correct, I suggest we fix standard.css (which drives classic's look and feel) to behave like Monobook. To do so, we need only add the following to the stylesheet:

 div.tright {
   clear: right;
 }

This makes images stack vertically, the way they do in Monobook. I know of no problems with this. Does anyone object to my making this change? -- Finlay McWalter | Talk 22:21, July 28, 2005 (UTC)

Gosh - if it is as easy as that, and there are no side-effects, please do it straight away! This is a fix that I have been waiting for for years (well, dog-years). -- ALoan (Talk) 11:05, 31 July 2005 (UTC)
I've tried it in my standard.css and it seems to work: if anyone else wants to try it, see Finlay McWalter's instruction in my talk page archive. -- ALoan (Talk) 10:09, 5 August 2005 (UTC)

Please, please, please make this change! I raised the issue a while ago [1] and I'd really like to see it fixed! I'm hesitant to fix it myself because I don't understand the Wikipedia style sheets very well and I don't want to break anything for other users. Note that someone has pointed out the same problem with the Cologne Blue skin, too; I don't know where that style sheet is, but if someone could fix it there as well that would be great! - Brian Kendig 15:48, 8 August 2005 (UTC)

It's done. If no-one has a problem over the next couple of days, I'll look into making the same change for Cologne Blue. -- Finlay McWalter | Talk 17:33, August 8, 2005 (UTC)

[edit] Coordinates in article heading

#coordinates {  
 position:absolute;
 z-index:1;
 border:none;
 background:none;
 right:24px;
 top:4.5em;
 float:right;
 margin:0.0em;
 padding:0.0em;
 line-height:1.5em;
 text-align:right;
 text-indent:0;
 font-size:85%;
 text-transform:none;
 white-space:nowrap;
}

Image:Chicago with Standard top 4.5em coordinates.pdf

--William Allen Simpson 09:14, 27 April 2006 (UTC)

[edit] div.topicon

At least in IE, the Featured Article star (which is affected by this) displays in the wrong place on the screen in this skin, and so is broken (the absolute placing on the star is affected by things like the other-languages list). Could an admin please comment this section of code out (the entire div.topicon definition)? --ais523 11:31, 7 July 2006 (UTC)

Done. howcheng {chat} 17:39, 7 July 2006 (UTC)

[edit] Change to div.tleft

Per Wikipedia:Village pump (technical)#Left thumbnail image and bullet list overlap issue, I suggest adding the following definition of div.tleft (which will override the one in common/common.css - the difference is the addition of the border-width line). If anyone objects, please speak up. -- Rick Block (talk) 21:16, 29 July 2006 (UTC)

div.tleft {
        float: left;
        margin-right: .5em;
        border-width: .5em 1.4em .8em 0;
}
Well, I have no objections over this. --Siva1979Talk to me 16:19, 30 July 2006 (UTC)
I've made this change, but it doesn't seem to work (after a forced reload, and all that). Anyone have any ideas why not? If I look at the HTML for an article, the css import list looks like this:
@import "/skins-1.5/common/wikistandard.css?1";
@import "/w/index.php?title=MediaWiki:Common.css&action=raw&ctype=text/css&smaxage=2678400";
@import "/w/index.php?title=MediaWiki:Standard.css&action=raw&ctype=text/css&smaxage=2678400";
@import "/w/index.php?title=User:Rick_Block/standard.css&action=raw&ctype=text/css";
div.tleft is specified in both MediaWiki:Standard.css and common/common.css (which is imported by common/wikistandard.css). Does the first CSS definition win or something? -- Rick Block (talk) 18:50, 4 August 2006 (UTC)

[edit] Template:Coord in Classic skin

There is a problem with the template "Coord" (and related templates) when viewed using the classic skin. See Template talk:Coord. and WP:VPT. Brighton is a good example of the problem. -- SGBailey 16:02, 29 May 2007 (UTC)

This should be fixed now. Adambro 16:59, 5 June 2007 (UTC)
But it isn't. Hmm. What I've done is solved one problem and created another. Because the coordinates are placed a fixed distance from the page top using CSS, pages with a different number of language etc. links to Brighton still has the problem. I'll look into finding a solution to this but at least we now know where to look and so I hope to be able to sort this out soon. Adambro 17:13, 5 June 2007 (UTC)
It just needs to be removed. Mike Dillon 18:01, 5 June 2007 (UTC)
Adam asked me to clarify: It is not possible to get fixed position of the coordinates to work in this skin. The coordinates should be left inline. The "fix" is to entirely remove the #coordinates rule, or perhaps replace it with a "display: none" rule. Mike Dillon 21:02, 5 June 2007 (UTC)

{{edit protected}}

Please consider making the following changes in the #coordinates section:
  • top:12em ==> top:3.5em
  • right:30px ==> left:163px
This puts the co-ordinates between "Printable version" and "In other languages", on the left side. This should be a fixed position, and not interfere with other messages. – Tivedshambo (talk) 16:19, 9 June 2007 (UTC)
Nice, that seems to work. Well done for finding an improved solution for this. Adambro 17:32, 9 June 2007 (UTC)
Thanks - Can the same fix be used for the "Star" of Wikipedia:Featured articles? -- SGBailey 19:40, 17 July 2007 (UTC)

[edit] Image as link problem in Classic skin

The following is reposted from WP:VPT (2007-08-21):

[edit] Images in Faeroes

Why do several of the images in Faeroes not act as a link to the upload page? I thought all images did this. -- SGBailey 20:50, 21 August 2007 (UTC)

They are all fine for me. Adrian M. H. 21:11, 21 August 2007 (UTC)
(edit conflict) They seem to be fine on my screen. Both the images hosted on Commons and the images hosted on this Wikipedia. Valentinian T / C 21:12, 21 August 2007 (UTC)
I tried it again (using classic skin, XP & MSIE7) and it isa still the same. Flag OK, Coat OK, Map OK, Stamp OK, Tinganes BAD, Map OK, Aerial BAD, Litla BAD, Satellite BAD, Sheep OK, Ferry BAD, Church OK, Food OK, Flowers OK, Puffin OK. -- SGBailey 05:45, 22 August 2007 (UTC)
I think you need to purge your IE cache. I just rechecked and the images are fine on my screen, including the image description pages from Commons. Valentinian T / C 05:49, 22 August 2007 (UTC)
Interesting. I purged my cache and tried it in Monobook - no problems. I logged in and used Classic skin and the problems recur. Log out and ok in monobook. -- SGBailey 07:05, 22 August 2007 (UTC)
Exactly the same thing happens with the two skins on a different PC (at work) -- SGBailey 08:07, 22 August 2007 (UTC)

This appears to be skin related. Is it fixable? -- SGBailey 18:59, 22 August 2007 (UTC)

I use Classic skin in IE6 and don't have any problems. – Tivedshambo (talk) 19:31, 22 August 2007 (UTC)