User:Sky6t/sandbox

I am very sad to see this all...

This paragraph IE10 spelling correction is based on the latest Microsoft spellchecking engine and dictionaries. IE10's spell checker also includes auto-correction to help correct mistakes while you type! acceptable* committed discipline*

This is the user sandbox of Sky6t. A user sandbox is a subpage of the user's user page. It serves as a testing spot and page development space for the user and is not an encyclopedia article. Create or edit your own sandbox here.

Other sandboxes: Main sandbox | Template sandbox

Finished writing a draft article? Are you ready to request review of it by an experienced editor for possible inclusion in Wikipedia? Submit your draft for review!

check my spelling as I type.

Text-align and position

My position is absoluteMy text-align is center

Now it seems to work fine to make this absolutely positioned element center.

Pre test

 __________     __________       ____________             _________      ______     ______    ________
|_    ___  \   |_    ___  \     |_    _____  |           /  _____  \    |_    _|   |_    _|  |__    __|
  |  |   \  \    |  |   \  \      |  |     |_|          /  /     \  \     |  |       |  |       |  |
  |  |___/  /    |  |___/  /      |  |______           /  /       |__|    |  |       |  |       |  |
  |  ______/     |   _   _/       |   ______|         /  /      _______   |  |       |  |       |  |
  |  |           |  | \  \        |  |                \  \     |__   __|  |  |       |  |       |  |
  |  |           |  |  \  \       |  |      _          \  \       |  |    |  |       |  |       |  |
 _|  |__        _|  |_  \  \__   _|  |_____| |          \  \_____/  /      \  \_____/  /      __|  |__
|_______|      |______|  \____| |____________|           \_________/        \_________/      |________|

border-radius and dotted borders

Internet Explorer would display it right, but Firefox and Google Chrome would treat it as if it were border-style: solid.

This has been fixed.

Some

G

Moon

Font-feature-settings test

Efficient font-feature-settings, 0123456789.

Efficiently on the fifth floor, 0123456789.

Background-attachment: fixed and transform

Paragraph

Signature

Sky 6t 14:33, 22 April 2014 (UTC)

Ampersand

& & & & & & & & &

Tables

Text inside

The two tables look different in IE11.

Code

<table style="box-shadow:0 0 0 1px #ccc;border-collapse:collapse">
<tr><td style="padding:.3em .5em">Text inside</td></tr>
</table>

<table style="box-shadow:0 0 0 1px #ccc;border-spacing:0">
<tr><td style="padding:.3em .5em">Text inside</td></tr>
</table>

letter spacing

Quick brown foxes jump over the lazy dog. Illustrating the indifferent.

Run-in

Supported has been dropped for display: run-in.

Relative and top

I am here

Flex

I am the inner element.

Inline-block and overflow: hidden

Quick brown fox

Safari will mistakenly align them.

More inline-block

Quick

Brown

Quick

Float and width

aQuick

UL

Quick
Brown

Stacking

Text

One: absolute

Two: floated

Three: static

Text

One: absolute

Two: floated with opacity

Three: static transformed

Text

One: absolute

Two: floated with opacity

Three: relative

One: absolute with z-index: -1

Text

The model

Here we propose a better model concerning the stacking order, with how stacking contexts influence stacking behavior taken into consideration (modified from https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_and_float):

Static, non stacking context-forming, non-floated elements;
floating elements, text and inline elements in static elements;
positioned elements and stacking context-forming elements (including elements with z-index set to 0);

The order within each item is in the order of appearance in the DOM.

float

Hello world

Margin collapsing

The quick brown fox

jumps

over the lazy dog.

The quick brown fox jumps over the lazy dog.

CSS parabola

Hyperbola

Overflow: hidden

flex-grow: 1

some text