1

私の理解では、親の div (#homepage_web_drop_webDesign_wrap) の左上隅にあるはずの div (#homepage_web_title_webDesign) がありますが、代わりにそのすぐ下に表示されています。どんな助けでも大歓迎です!JSFiddle には、私が使用しているリセットが含まれています。

JSFiddle: http://jsfiddle.net/Y7UGp/3/

HTML:

<div id="homepage_web_drop_webDesign_wrap" style="background-color:rgba(0,255,0,.1);">
    <img id="homepage_web_drop_webDesign" src="http://upload.wikimedia.org/wikipedia/commons/thumb/e/eb/Piratey_transparent_background.svg/383px-Piratey_transparent_background.svg.png" />
    <div id="homepage_web_title_webDesign">Web Design</div>
    <div id="homepage_web_description_webDesign">Creative Web Design should fit your budget and satisfy both you and your customers.</div>
</div>

CSS:

    #homepage_web_drop_webDesign_wrap {
        position:absolute;
        margin-left:0%;
        margin-top:0%;
        height:320px;
        width:260px;
    }
    #homepage_web_drop_webDesign {
        display:inline;
        width:100%;
        height:100%;
    }
    #homepage_web_title_webDesign {
        font-family:ElectrofiedBoldItalic;
        color:rgb(120,91,67);
        position:absolute;
        background-color:purple;
        margin-left:0%;
        margin-top:0%;
        z-index:65;
    }

(画像はGoogleのランダムなものに差し替えましたが、寸法はCSSで設定されているので明らかに問題ありません。)

4

2 に答える 2

3

、、またはposition: absolute;の値なしでのみ設定します。したがって、要素は通常のフローで表示される場所に配置されます。これらの値のいずれかを設定すると、それに応じて配置されます。topbottomleftright

この新しいフィドルを参照してください。

于 2013-04-23T19:15:23.567 に答える
1

jsFiddle Demo

margin-left:0現在の配置のオフセットです。使用する必要があります

left:0;
top:0;

前の要素の上に配置する場合

于 2013-04-23T19:14:18.147 に答える