- margin: 0;
- border: 2px solid blue;
-
- /*
- * Borders and padding:
- */
-
- /* observation 1: Firefox doesn't apply top/bottom borders to spans in button */
- /* observation 2: Webkit leaves out some padding to left/right
- also: it cuts the top/bottom margin to 1px max */
-
- /* observation 3: Opera does the oposite then WK and FF ->
- span has all borders, button has only left/right
- */
-
- /* Line Height */
-
- /* 1. Wszystkie przeglądarki, domyślnie ustawiają vertical-align: baseline */
- vertical-align: baseline;
-
- /* 2. Opera ustawia rozmiar przycisku, na rozmiar line-height obiektu, który go zawiera */
-
- display: inline-block;
- position: relative;
- background: yellow;
- padding: 2px 4px;
-
- font-size: 16pt;
- text-decoration: none;
-}
-
-*.button:active {
- background: aqua;
-}
-
-*.button > span.upper-bg {
- position: absolute;
- top: 0px;
- left: 2px;
- right: 0px;
- bottom: 5px;
-
- margin: 0px;
-
- background-color: white;
- z-index: 0;
- display: block;
-}
-
-*.button > span.button-text {
- position: relative;
- margin: 0px;
- display: inline-block;
- z-index: 2;
- background: blue;
- opacity: 0.5;