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

要到达您想去的地方，您需要将以下内容添加到以下 css 中：

.add_sale_image_container { 
    float: left; 
    margin-right: 10px;
}

我制作了一个 jsfiddle，向您展示了它的外观：http: //jsfiddle.net/mattokdla/L9Wre/

您可以将整个容器留给 inlin-block 而不将其浮动，但内部的 div 需要向左浮动，如 jsfiddle 文件中所示以使其工作。这样，它还可以让您控制 2 个 div 之间的边距空间。

于 2013-07-29T16:20:42.400 回答
0

向右浮动控制部分，float: right;

演示http://jsfiddle.net/kevinPHPkevin/fAAXU/

于 2013-07-29T16:11:32.227 回答