1

周りを見回して、画像を中央に配置するための提案を試みましたが、通常は問題なく機能しますが、何かが正しくない状況があります.

テスト ページに移動すると: http://www.503rephotography.com/_temp/ - 画像が少し右に押し出されていることがわかります。画面のサイズを増減すると、中心位置から少しずれることがあります。

私は CSS に不慣れで、これが機能しない原因となる何かが台無しになっている可能性があります。ここでいくつかのヒントを使用して、ページのコンテンツを含む div をやや中央に配置しました。今、その div ボックス内で画像を中央に配置しようとしています。どんな助けでも大歓迎です!!

4

1 に答える 1

0

コンテンツを中央に配置するmargin-left:auto:には、div コンテナーを作成する必要があります。margin-right:auto;

<div id="container">
            <div id="header">
                <h1 id="logo">
                    <a href="http://www.503rephotography.com">
                        <img src="images/logo.png" alt="503 rephotography">
                    </a>
                </h1>
                <ul class="navbar">
                    <li class="button"><a href="#">SERVICES</a></li>
                    <li class="button"><a href="p.html">PORTFOLIO</a></li>
                    <li class="button"><a href="#">CONTACT 503</a></li>
                </ul>
            </div>
            <div id="topbar"></div>
            <div id="content">
                <img src="http://www.503rephotography.com/_temp/slides/1.jpg">
                <div class="sub">
                    <p>Content will go here....why can't I get this div box to be centered???</p>
                </div>
            </div>
        </div>


このフィドルを試して、必要なものかどうかを確認してください: http://jsfiddle.net/ftPa3/

于 2013-05-31T13:25:31.853 に答える