如何将此div与父div中的右下角/左对齐?

时间:2014-04-28 22:20:40

标签: css html

所以,我一直试图得到< div = id =“action”>到<的底部div with class =“right”>。在代码中,您可以看到我尝试使用位置相对和底部:0但它没有做任何事情。我可以漂浮到右边那么好,所以我只需要把它放到底部。现在它只是一直放在文本下面。

echo "<div class=\"product\">";
    echo "<div class=\"left\">";
        echo "<div style=\"width:225px;height:180px;background:#ccc\">" . $obj->product_img_name . "</div>";
    echo "</div>";

    echo "<div class=\"right\">";
        echo "<form method='post' action='update.php'>"; 
            echo "<h3>" . $obj->product_name . "</h3>";
            echo "<p>" . $obj->product_desc . "</p>";
            echo '<input type="hidden" name="action" value="add" />';
            echo "<input type=\"hidden\" name=\"id\" value=\" $obj->id \" />";
                    echo "<div id=\"action\" style=\"position:relative;bottom:0;float:right;\">";
                         echo $obj->price;
                         echo <input type=\"text\" name=\"quantity\" />";
                         echo "<input type='submit' value ='Add To Cart'>";
                    echo "</div>";
         echo "</form>";
    echo "</div>";

我认为它不可能因为div在表单中,但我试图在表单下面放一个div,看看相对是否有效,但它仍然不起作用。

css:

.wrapper{
    width:824px;
    padding:10px 20px;
    margin:0 auto;
    background:#eeeeee;
}
.right{
    height:200px;
    width:550px;
    float:right;
}
.right p{
    font-size:0.95em;
}
.left{
    width:250px;
    float:left;
    padding:20px 0 0;
}
.product{
    height:200px;
    margin-bottom:50px;
}

1 个答案:

答案 0 :(得分:1)

如果.action可以绝对定位......

.right {
  position: relative;
  /* other code */
}
.action {
  position: absolute;
  right: 0;
  bottom: 0;
  /* other code */
}