0

画像を参照してください: https://dl.dropboxusercontent.com/u/63494571/whatswrong_div.jpg

上の画像でわかるように、何らかの理由で私の画像は最初の div の途中までしか表示されていません。同じ高さですぐ隣にあるはずです。

最終的にどのように見えるかの画像へのリンクは次のとおりです: https://dl.dropboxusercontent.com/u/63494571/add_sale_new.jpg

CSS

.add_sale_background {
    background-color:#353535;
    border:solid #000 1px;
    border-radius: 10px;    
}
.add_sale_container { width:210px; margin:1em; font-size:14px; display:inline-block; }

.add_sale_image_container { width:150px; text-align:left; padding:4px; display:inline-block; }
.add_sale_image { height:135px; width:135px; background-size:cover; margin: 7.5px; }
.add_sale_selected_product > span {
    margin:2px;
    border-radius:5px;
    padding:2px;
    cursor:pointer;
    background-color:#353535;
    border:solid #000 1px;
    border-radius: 5px;
    display:inline-block;
}
.add_sale_selected_product > span:hover { background-color:#005c9c; }

.add_sale_controls_container {
    width:35px;
    height:200px;
    display:inline-block;
}

html

    <div class="sidebar">
        Sidebar
    </div>
    <div class="add_sale_container">
        <form name="sale">
            <div class="add_sale_image_container add_sale_background">
                <div>image1</div>
                <div class="add_sale_image" style="background-image:url(images/image4.JPG);"></div>
                <div class="add_sale_selected_product">
                    <span>KR</span>
                </div>
                <input type="hidden" id="applied_product" value="KR" />
            </div>
            <div class="add_sale_controls_container add_sale_background">
                dsa
            </div>
        </form>
    </div>
4

2 に答える 2

0

コントロール部を右にフロートさせ、float: right;

デモhttp://jsfiddle.net/kevinPHPkevin/fAAXU/

于 2013-07-29T16:11:32.227 に答える