html - 如何让产品图片和描述重叠-6ren

html - 如何让产品图片和描述重叠

转载作者：行者123 更新时间：2023-11-28 14:02:20

购物车包含使用下面的 html 创建的产品页面和图像。如果在浏览器中使用 ctrl++ 缩小页面，图像和文本将重叠:图像变宽但文本不会向右移动足够，它在图像上方。如何解决此问题以便文本在图像之后开始？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-    strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
...
        <div>
            <div style="float: left; width: 30%">

                <a class="fbox" href="/store/Store/Lightbox?product=FTL286%252f42">
                    <img style="width: 200px" alt="" src="/store/Store/MainImage?product=FTL286%252f42" />
                </a>
            </div>
            <div style="float: left; Xmargin-left: 4%">
                <div style="margin: 3%">

                </div>
                <div>
                    <b>
                        € 78,92</b>
                    <br />

                    <br />
                    <div style="height: 1.5px">
                    </div>
Availability:<b>
                        In order
                    </b>
                    <form action="/store/Store/Details?product=FTL286%252f42" method="post">
                    <br />
                    <input id="ProductId" name="ProductId" type="hidden" value="FTL286/42" />
                    Quantity
                    <input id="Quantity" name="Quantity" style="width:30px" type="text" value="1" />

                </div>
                <br />
                <br />
                <input type="submit" value="Add to cart" class="button green rounded" />
                </form>
            </div>
        </div>