あらかじめエディタに書くコード

                    <div class="block">
    <h1>タグとアイコンを左右に設置しよう</h1>
    <div class="block-wrap">
        <ul class="block-tag">
            <li>忍者</li>
            <li>忍者CODE</li>
            <li>甲賀村</li>
            <li>伊賀村</li>
            <li>服部半蔵</li>
            <li>HTML</li>
            <li>ハットリくん</li>
        </ul>
        <ul class="block-icon">
            <li>●</li>
            <li>▲</li>
            <li>■</li>
        </ul>
    </div>
</div>
¥HTML¥
                

                    ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.block {
    border: 1px solid;
    width: 640px;
    margin: auto;
}
h1 {
    text-align: center;
    margin: 16px 0;
}
¥CSS¥
                

期待する画面