Skip to content

Instantly share code, notes, and snippets.

@SelenIT

SelenIT/dabblet.css

Forked from anonymous/dabblet.css
Last active December 27, 2015 11:18
Download ZIP

Revisions

  1. SelenIT revised this gist Dec 27, 2015. 2 changed files with 11 additions and 6 deletions.
    15 changes: 10 additions & 5 deletions dabblet.css
    View file
    Original file line number Diff line number Diff line change
    @@ -14,7 +14,7 @@

    margin: 10px auto 10px;
    padding: 10px 0;
    6width: 500px;
    min-width: 500px;

    }

    @@ -45,8 +45,10 @@
    -webkit-justify-content: space-between; /* оптимизация для Safari */
    display: flex;
    justify-content: space-between;
    text-align: justify; /* IE10-, Firefox 12-22 */
    text-align-last: justify; /* IE10-, Firefox 12-22 */
    -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- */
    @@ -57,9 +59,8 @@
    display : inline-block;
    width : 100px;
    height: 100px;
    margin: 0 0 20px;
    background: #E76D13;
    vertical-align: top;
    vertical-align: bottom;
    text-align: center;

    display: -webkit-box; /* !хак! для Android 4.3-, должен идти после inline-block */
    @@ -68,4 +69,8 @@

    /*display: inline; /* IE7- */
    /*zoom: 1; /* IE7- */
    }

    .tall {
    height: 20em !important;
    }
    2 changes: 1 addition & 1 deletion dabblet.html
    View file
    Original file line number Diff line number Diff line change
    @@ -2,7 +2,7 @@ <h1><span>Современное решение</span></h1>
    <div class="test-box">
    <ul>
    <li>Пункт 1</li>
    <li>Пункт 2</li>
    <li class="tall">Пункт 2</li>
    <li>Пункт 3</li>
    <li>Пункт 4</li>
    <li>Пункт 5</li>
  2. SelenIT revised this gist Dec 27, 2015. No changes.
  3. @invalid-email-address Anonymous created this gist Oct 8, 2014.
    71 changes: 71 additions & 0 deletions dabblet.css
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,71 @@
    /* Общие стили - Для оформления */
    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;
    6width: 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;
    text-align: justify; /* IE10-, Firefox 12-22 */
    text-align-last: justify; /* IE10-, Firefox 12-22 */

    /*text-justify: newspaper; /* IE7- */
    /*zoom: 1; /* IE7- */
    }


    .test-box ul li {
    display : inline-block;
    width : 100px;
    height: 100px;
    margin: 0 0 20px;
    background: #E76D13;
    vertical-align: top;
    text-align: center;

    display: -webkit-box; /* !хак! для Android 4.3-, должен идти после inline-block */



    /*display: inline; /* IE7- */
    /*zoom: 1; /* IE7- */
    }
    11 changes: 11 additions & 0 deletions dabblet.html
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,11 @@
    <h1><span>Современное решение</span></h1>
    <div class="test-box">
    <ul>
    <li>Пункт 1</li>
    <li>Пункт 2</li>
    <li>Пункт 3</li>
    <li>Пункт 4</li>
    <li>Пункт 5</li>

    </ul>
    </div>
    1 change: 1 addition & 0 deletions settings.json
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    {"view":"split","fontsize":"100","seethrough":"","prefixfree":"","page":"all"}