-1
私は現在少しのスタートページをまとめていますが、リスト内の説明できないパディングの問題に問題があります。テーブル内の順序付けられていないリスト内の不明なパディング
<html>
<body>
<style type="text/css">
\t \t html, * {
\t \t \t font-family: Hermit, monospace;
\t \t \t color: #eceff1;font-size: 12px;
\t \t \t height: 100%;
\t \t }
\t \t body {
\t \t \t font-size: 12px;
\t \t \t background: #222c32;
\t \t \t color: #222c32;
\t \t \t margin: 0;
\t \t \t padding: 0;
\t \t }
\t \t ul {
\t \t \t list-style-type: none;
\t \t \t margin: 0;
\t \t \t padding: 0;
\t \t }
\t \t li {
\t \t \t margin-left: 15px;
\t \t }
\t \t h1 {
\t \t \t font-size: 16px;
\t \t \t color: #222c32;
\t \t \t text-align: center;
\t \t \t margin: 0;
\t \t \t padding: 0;
\t \t }
\t \t p {
\t \t \t color: #222c32;
\t \t \t margin: 0;
\t \t \t padding: 0;
\t \t }
\t \t a {
\t \t \t color: #222c32;
\t \t \t text-decoration: none;
\t \t }
\t \t .theme {
\t \t \t outline: 3px solid black;
\t \t \t background: white;
\t \t \t color: black;
\t \t }
\t \t .container {
\t \t display: table;
\t \t position: absolute;
\t \t height: 100%;
\t \t width: 100%;
\t \t }
\t \t .cent {
\t \t \t display: table-cell;
\t \t \t vertical-align: middle;
\t \t }
\t \t .content {
\t \t \t margin-left: auto;
\t \t \t margin-right: auto;
\t \t \t width: 800px;
\t \t \t height: 500px;
\t \t }
\t \t .links {
\t \t \t margin: 10px 5px 5px 10px;
\t \t \t width: 555px;
\t \t \t height: 445px;
\t \t \t float: left;
\t \t \t position: relative;
\t \t }
\t \t .picture1 {
\t \t \t color: black;
\t \t \t margin: 10px 10px 5px 5px;
\t \t \t width: 215px;
\t \t \t height: 215px;
\t \t \t float: right;
\t \t \t position: relative;
\t \t \t background: url("dmc.jpg")
\t \t }
\t \t .picture2 {
\t \t \t margin: 10px 10px 5px 5px;
\t \t \t width: 215px;
\t \t \t height: 215px;
\t \t \t float: right;
\t \t \t position: relative;
\t \t \t background: url("kaneda.jpg")
\t \t }
\t \t .gsearch {
\t \t \t margin: 5px 5px 10px 10px;
\t \t \t width: 555px;
\t \t \t height: 25px;
\t \t \t float: left;
\t \t \t position: relative;
\t \t }
\t \t .ysearch {
\t \t \t margin: 5px 10px 10px 5px;
\t \t \t width: 215px;
\t \t \t height: 25px;
\t \t \t float: right;
\t \t \t position: relative;
\t \t }
\t \t .header {
\t \t \t margin-top: 150px;
\t \t \t height: auto;
\t \t \t text-align: center;
\t \t }
\t \t .linktext {
\t \t \t margin-left: 10px;
\t \t \t text-align: center;
\t \t }
\t </style>
</head>
<body>
\t <div class="container">
\t \t <div class="cent">
\t \t \t <div class="content">
\t \t \t \t <div class="links theme">
\t \t \t \t \t <div class="header">
\t \t \t \t \t \t <h1>kakarotten</h1>
\t \t \t \t \t \t <table>
\t \t \t \t \t \t \t <tr>
\t \t \t \t \t \t \t \t <th>
\t \t \t \t \t \t \t \t \t <ul>
\t \t \t \t \t \t \t \t \t \t <li><a href="http://boards.4chan.org/a/">/a/</a></li>
\t \t \t \t \t \t \t \t \t \t <li><a href="http://boards.4chan.org/asp/">/asp/</a></li>
\t \t \t \t \t \t \t \t \t \t <li><a href="http://boards.4chan.org/mu/">/mu/</a></li>
\t \t \t \t \t \t \t \t \t \t <li><a href="http://boards.4chan.org/tg/">/tg/</a></li>
\t \t \t \t \t \t \t \t \t \t <li><a href="http://boards.4chan.org/w/">/w/</a></li>
\t \t \t \t \t \t \t \t \t </ul>
\t \t \t \t \t \t \t \t </th>
\t \t \t \t \t \t \t \t <th>
\t \t \t \t \t \t \t \t \t <ul>
\t \t \t \t \t \t \t \t \t \t <li><a href="https://reddit.com/r/squaredcircle/">sqrdcrcl</a></li>
\t \t \t \t \t \t \t \t \t \t <li><a href="https://reddit.com/r/unixporn/">unxprn</a></li>
\t \t \t \t \t \t \t \t \t \t <li><a href="https://reddit.com/r/vinyl">vinyl</a></li>
\t \t \t \t \t \t \t \t \t </ul>
\t \t \t \t \t \t \t \t </th>
\t \t \t \t \t \t \t </tr>
\t \t \t \t \t \t </table>
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t \t <div class="picture1 theme"></div>
\t \t \t \t <div class="picture2 theme"></div>
\t \t \t \t <div class="gsearch theme"></div>
\t \t \t \t <div class="ysearch theme"></div>
\t \t \t </div>
\t \t </div>
\t </div>
</body>
</html>第二のリストに沿って自分自身を間隔をしているようだ、私は、なぜ思ったんだけど：ここでは今のところ完全なコードです。
これは「
@junkfoodjunkieどのように私は最高の方法でお互いの隣に3または4の順序付けられていないリストを配置するつもりですか？私は便宜のためにテーブルを使っていましたが、それは悪い習慣であると理解しています。 –
私がflexboxを使って与えた例を見てください。これは、フロートまたはインラインブロックを使用せずに簡単なアプローチを提供します。フレックスボックスの詳細については、https://css-tricks.com/snippets/css/a-guide-to-flexbox/ – haltersweb
答えて
私は@junkfoodjunkieに同意します。しかし、それはこのCSSルールのためです。
これはすべてをコンテナの高さの100％に設定しています。
<ul>にdisplay:inline-block;を使用して、tableではなく、隣り合わせに配置することもできます。出典
2016-11-17 22:55:30
を参照してください。ありがとう、私は次回のために知っている。 –
@LouieHendersonそれはあなたの他のリストに影響するようには見えなかったのは面白いです。 –
フレックスボックスを使用して、並べ替えられていないリストを並べて配置します。
出典
2016-11-17 22:53:20 haltersweb
あなたのテーブル構造は間違っています。テーブルのヘッダとしてthを使用し、テーブルの行としてtrを使用する必要があります。
以下の例：
私は、これはあなたが探しているものであると思います。 運が良ければ
出典
2016-11-17 22:57:43 Kamil
テーブルヘッダーは、行に囲まれている必要があります。 –
「
関連する問題