1

私は CSS の検証を行いました (いくつかの厄介な閉じられていないタグが見つかりましたが、現在はソートされています)。ページの右上に画像を配置し、タイトル テキストを左上に配置しようとしています。

私はこれを行うことができますが、ブラウザ ウィンドウのサイズを変更すると、いずれかのサイズが変更される前に、画像が常にタイトル テキストに重なります。画像を配置するために使用した余白を削除すると、画像はタイトル テキストのすぐ右側ではなく、その下 (および右側) に配置されますが、これを (配置を維持しながら) 削除すると、鍵。ただし、画像を他の要素と重ねる必要があります。

画像のコードのスニペットは次のとおりです。

img#site-logo {
    max-width: 100%;
    height: auto;
    clear: both;
    position: relative;
    z-index: 0;
    margin: -12.87em 2em -16em 0px;
}

サイトのタイトルについては、次のとおりです。

#site-title a {
    font-size: 4.875em;
    font-weight: bold;
    line-height: 78px;
    padding: 0px;
    margin-right: auto;
    white-space: nowrap;
    z-index: 2;
    position: relative;
}

サイトはここでライブです：

http://dominicpalma.com/

4

1 に答える 1

2

あなたの問題を解決するには、確かにいくつかの異なるアプローチがあります。min-widthしかし、私の目には、#page要素に a を設定するのが最善の解決策です。

#page{
    min-width:900px;
}

私は幅を少しいじってみましたmin-widthが、900 pxがあなたのケースに最適だと思います.

于 2013-03-01T15:48:01.793 に答える