Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Пример 9</title>
        <link rel="stylesheet" type="text/css" href="css/lesson9.css">
    </head>
<body>
    <div class="container cf">
        <div class="nickname">UserName<br>12 декабря</div>
            <p>Считаю ваше мнение абсолютно беспочвенным и необоснованным, сударь, и требую в связи с этим немедленной сатисфакции!</p>
            <a href="like1"  class="request">Мне нравится</a>
            <a href="reply2" class="request" >Ответить</a>
    </div>
    <div class="container cf">
        <div class="nickname">Anonymous<br>12 декабря</div>
            <p>Устроит ли вас Петровско-Разумовская в качестве места встречи?</p>   
            <a href="like3"  class="request">Мне нравится</a>
            <a href="reply4" class="request" >Ответить</a>
    </div>
    <div class="container cf">
        <div class="nickname">UserName<br>12 декабря</div>
            <p>Вполне; буду ждать вас там завтра в полдень</p>  
            <a href="like5"  class="request">Мне нравится</a>
            <a href="reply6" class="request" >Ответить</a>
    </div>      
</body>
</html>
 
html{
    font-size: 12px;
    line-height: 1.5;
}
        /* Start of "Micro clearfix" */
.cf:before,.cf:after {content: " ";display: table;}
.cf:after            {clear: both;}
.cf                  {*zoom: 1;}
        /* End of "Micro clearfix" */
.container{
    margin: 10px 40px 20px 10px; 
    padding-left: 170px;
}
.nickname{
    float: left;
    color: #376ad1;
    text-align: center;
    width: 150px;
    margin: 10px -170px 10px -160px;
}
.request{
    float: right;
    margin: 10px;
}
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers