CSS

From WhyNotWiki

Jump to: navigation, search

CSS  edit   (Category  edit)


Contents

[edit] Horizontal centering: margin:auto

http://www.bluerobot.com/web/css/center1.html

[edit] Vertical centering

http://www.jakpsatweb.cz/css/css-vertical-center-solution.html

http://www.ibloomstudios.com/article6/

[edit] Fonts

[edit] Font-family

font-family cane be: serif, sans-serif, monospace, cursive and fantasy

[edit] Text/text decorations

[edit] Double underline

http://perishablepress.com/press/2006/08/27/crazy-css-underline-effects/ Crazy CSS Underline Effects « Perishable Press

u.double { /* -- double underline -- */
        border-bottom: 1px solid;
}
.altdouble { /* alternate double */
        border-bottom: 3px double;
        line-height: 1.7em;
}
u.triple { /* -- triple threat -- */
        border-bottom: 3px double;
        line-height: 1.9em;
}

[edit] Strikethrough

I often forget the exact wording of this, and end up writing something like this:

font-decoration: strikethrough;  /* Doesn't work! */

, which doesn't work at all! This is how it is done in CSS:

text-decoration: line-through;

[edit] Fixed-width font

font-family: monospace

[edit] Superscript

vertical-align: super;

[edit] Images in CSS file are relative to the CSS file

If http://mysite.com/css/screen.css contained:

.RequiredField {
        background-image: url(../images/asterisk.gif);
}

then it would look for it at: http://mysite.com/images/asterisk.gif.

This would probably not work: url(images/asterisk.gif)

This might work (?): url(/images/asterisk.gif)

[edit] Fixed positioning

[edit] Using background-attachment

Used with great effect on http://www.valibuk.net/ stylesheet


body {
        background: #fff url('images/background.jpg');
        background-attachment: fixed;
        background-position: bottom right;
        background-repeat: no-repeat;
        color:#353535;
}

[edit] Miscellaneous

http://webstandardsgroup.org/features/john-gallant.cfm Web Standards Group - Ten Questions for John Gallant (Big John)

http://www.positioniseverything.net/index.php /* Position Is Everything */ — Modern browser bugs explained in detail!

http://www.positioniseverything.net/articles/mys-bug.html Mystery Bug (debugging CSS bugs, creating a minimal test case)

http://css-discuss.incutio.com/?page=FrontPage Front Page - css-discuss

[edit] Learning/reference

http://csszengarden.com/

[edit] Reference links

http://www.w3schools.com/css/css_reference.asp


[edit] Article metadata

Aliases: CSS, not Css, Stylesheets, Cascading stylesheets, Cascading style sheets

Retrieved from "http://whynotwiki.com/CSS"
Personal tools