CSSを使用したulインデントの削除

154

リストの長い行が折り返されると、順序付けられていないリストからインデントを削除できないようです。私のリストは次のようになります：

Windowsユーザーはputtyを使用できます
MacユーザーはTerminal.appを使用できます
LinuxユーザーはSSH userid@ourserver.comポート22を使用できます
...........>または、CyberduckのようなSFTPプログラムを使用して、それを........................... ..............> ourserver.com、ポート22

（ドットはインデントを示します）

私はたくさんの解決策を読み、テキストインデント、リストスタイルを使用してマージンとパディングをゼロに設定しようとしましたが、何も機能しません。問題は、リストの上に中央揃えする必要がある見出しがあるため、マージンを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 userid@ourserver.com 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;
}

html css html-lists

— 愚かな
ソース

私はそれをフィドルに入れました...これは私には正しいようですjsfiddle.net/qeqtK

— tedski

jsfiddleそれを参照してください...またはちょうどtedskiのリンクを使用したい人のため;）

ああ、でもあなたの "Normalized CSS"はチェックされています。これは通常見られるものではありません:)

— tedski

391

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

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

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

— ザック
ソース

1

ご回答ありがとうございます。私は今問題を理解しました。私が使用していたのは：body {text-align：center;}

— 厳粛な

9

-webkit-padding-start: 0;

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

— プリロック
ソース

0

これを次から削除#info：

    margin-left:auto;

これをヘッダーに追加します。

#info p {
    text-align: center;
}

固定幅など必要ですか？私は必要ないと思われるものを削除し、ヘッダーを中央に配置しましたtext-align。

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

— スマティ
ソース