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 edit

My position is absoluteMy text-align is center

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

Pre test edit

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

border-radius and dotted borders edit

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 edit

G

Moon edit

Font-feature-settings test edit

Efficient font-feature-settings, 0123456789.

Efficiently on the fifth floor, 0123456789.

Background-attachment: fixed and transform edit

Paragraph

Signature edit

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

Ampersand edit

& & & & & & & & &

Tables edit

Text inside

The two tables look different in IE11.

Code edit

<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 edit

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

Run-in edit

Run-in

Supported has been dropped for display: run-in.

Relative and top edit

I am here

Flex edit

I am the inner element.

Inline-block and overflow: hidden edit

Quick brown fox

Safari will mistakenly align them.

More inline-block edit

Quick

Brown

Quick

Float and width edit

aQuick

UL edit

Quick
Brown

Stacking edit

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 edit

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 edit

Hello world

Margin collapsing edit

The quick brown fox

jumps

over the lazy dog.

The quick brown fox jumps over the lazy dog.

CSS parabola edit

Hyperbola edit

Overflow: hidden edit

flex-grow: 1

some text