web-dev-qa-db-ja.com

CSSによるul字下げの削除

私のリストの長い行が折り返されるとき、私は私の順不同リストからインデントを削除するようには思えません。これが私のリストのようなものです。

  • WindowsユーザーはPuTTYを使用できます
  • MacユーザーはTerminal.appを使用できます
  • LinuxユーザーはSSH [email protected]ポート22を使用できます
  • ...........>またはCyber​​duckのようなSFTPプログラムを使用するだけで........................... ..............> ourserver.com、ポート22

（点はインデントを表します）

私はたくさんの解決策を読み、text-indent、list-styleを使って、marginとpaddingを0に設定しようとしましたが、何もうまくいきません。問題は、リストの上に中央揃えをする必要があるという見出しがあるため、余白をautoに設定した後、下のリストがめちゃくちゃになっていることです。しかし、たとえ私が親のdivの内側に2つのdivを入れてもそれはうまくいきません。

これがHTML/CSSです（他のすべての解決策が失敗する原因となっている設定がある場合は、すべて含めました）。

<div id="info">
    <p><strong>Did you know you can SSH directly to ourserver.com?</strong> </p> 
    <ul>
        <li>Windows users can use PuTTY</li>
        <li>Mac users can use the <a href="http://www.terminfo.org">Terminal.app</a></li>
        <li>Linux users can use SSH [email protected] port 22</li>
        <li>Or use an SFTP program like <a href="http://cyberduck.ch/">Cyberduck</a> just point it at ourserver.com, port 22</li>
    </ul>
</div>

#info {
    color:#FFFFFF;
    width:440px;
    margin-left:auto;
    margin-right:auto;
    border-radius: 10px;
    border-style:solid;
    border-width:2px;
    border-color:#FFF; 
    padding-bottom:20px; padding-left:20px; padding-right:20px;
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#333333), to(#cccccc));
    overflow: hidden;
}
#info ul li { 
    float:left;
}
htmlcsshtml-lists
125
solerous

このコードはインデントとリストの箇条書きを削除します。

ul {
    padding: 0;
    list-style-type: none;
}

http://jsfiddle.net/qeqtK/2/

327
Zac
-webkit-padding-start: 0;

webkitエンジンによって追加されたパディングを削除します

9
pleerock

これを#infoから削除します。

    margin-left:auto;

ヘッダにこれを追加してください。

#info p {
    text-align: center;
}

固定幅など必要ですか？私は自分の意見では不要なものは削除し、ヘッダーの中心をtext-alignにしました。

サンプル
http://jsfiddle.net/Vc8CB/

0
Smamatti