-
-
Save SelenIT/2ee9557cbcabfd6e4bc3 to your computer and use it in GitHub Desktop.
Общие стили - Для оформления
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* Общие стили - Для оформления */ | |
body { min-width: 600px; margin: 0 10px; font: 0.8125em/1 Verdana,sans-serif; background: #fff; } | |
h1 { | |
font: 1.8em Georgia,Times,serif; | |
margin-bottom: 0.5em; | |
color: #E76D13; | |
text-align: center; | |
} | |
h1 span { color: #000;} | |
.test-box { | |
background: #F8F7EF; | |
border: 1px dashed #000; | |
border-bottom: 1px dashed #000; | |
margin: 10px auto 10px; | |
padding: 10px 0; | |
min-width: 500px; | |
} | |
.test-box ul { | |
margin: 0; | |
padding: 0; | |
list-style: none; | |
} | |
.test-width { | |
background: #E4C17D; | |
margin-top: 10px; | |
text-align: center; | |
padding: 5px 0; | |
margin: 10px auto 10px; | |
} | |
/* CSS для примера */ | |
.test-box ul { | |
font: 14px Verdana, Geneva, sans-serif; | |
text-align: center; | |
display: -webkit-box; /* Android 4.3-, Safari без оптимизации */ | |
-webkit-box-pack: justify; /* Android 4.3-, Safari без оптимизации */ | |
display: -webkit-flex; /* оптимизация для Safari */ | |
-webkit-justify-content: space-between; /* оптимизация для Safari */ | |
display: flex; | |
justify-content: space-between; | |
-webkit-align-items: flex-end; | |
align-items: flex-end; | |
text-align: justify; /* IE10- */ | |
text-align-last: justify; /* IE10- */ | |
/*text-justify: newspaper; /* IE7- */ | |
/*zoom: 1; /* IE7- */ | |
} | |
.test-box ul li { | |
display : inline-block; | |
width : 100px; | |
height: 100px; | |
background: #E76D13; | |
vertical-align: bottom; | |
text-align: center; | |
display: -webkit-box; /* !хак! для Android 4.3-, должен идти после inline-block */ | |
/*display: inline; /* IE7- */ | |
/*zoom: 1; /* IE7- */ | |
} | |
.tall { | |
height: 20em !important; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<h1><span>Современное решение</span></h1> | |
<div class="test-box"> | |
<ul> | |
<li>Пункт 1</li> | |
<li class="tall">Пункт 2</li> | |
<li>Пункт 3</li> | |
<li>Пункт 4</li> | |
<li>Пункт 5</li> | |
</ul> | |
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{"view":"split","fontsize":"100","seethrough":"","prefixfree":"","page":"all"} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment