负余量是不允许在HTML中有任何其他解决方案吗?

时间:2017-10-23 10:25:32

标签: html5 css3 email

我知道负面保证金和头寸属性在电子邮件中不会支持,但有人可以建议我如何使用负边距和头寸属性来做到这一点吗?

 <!DOCTYPE html>
    <html lang="en">
        <head>
            <title>Rejected Mailer</title>
        </head>
        <body>
            <div class="middle" style="width:50%;margin:0 auto; background:#f4f4f4;">
        <div class="center_block" style="background:#fff;padding: 2%;height:auto;width:80%;margin:-8% auto; ox-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19); word-wrap: break-word;">
            <h5>Dear Supplier,</h5>
            <p>Your product has been rejected. Because of the following reasons:</p>
                <ul>
                    <li>Product image quality should be high.</li>
                    <li>Make sure your product price should match with whole sale market price less than all retailer price.</li>
                    <li>Product description should match with product.</li>
                    <li>Should not copy the description of your product from any other ecommerce website.</li>
                    <li>Unit should match with product.</li>
                    <li> Before adding product, choose proper category of the product you are going to be add.</li>
                </ul>
                <h5>Your Product Details:</h5>
                <ul class="nobullets">
                    <li>Product Name: Rice Flour</li>
                    <li>Product Description: XXXXXXXXXX</li>
                </ul>
            </div>
            <div class="footer" style="background:#000;padding: 1%;height:auto;width:80%;margin: 8% auto;color:#fff;">
                <p class="text-center">&copy ABC</p>
            </div>
    </div>
        </body>
    </html>

I want output like this But i am getting output like this

1 个答案:

答案 0 :(得分:0)

你的问题很不清楚。我不知道你在哪里使用负边距?也许在以div为中心?无论如何,请看下面的代码。它复制你的照片。如果这是您正在寻找的,请告诉我

 <html lang="en">
        <head>
            <title>Rejected Mailer</title>
        </head>
        <body>
            <div class="middle" style="width:50%;margin:0 auto; background:#f4f4f4;">
        <div class="center_block" style="background:#fff;padding: 2%;height:auto;width:80%;margin:-8% auto; nox-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19); word-wrap: break-word; box-sizing:border-box">
            <h5>Dear Supplier,</h5>
            <p>Your product has been rejected. Because of the following reasons:</p>
                <ul>
                    <li>Product image quality should be high.</li>
                    <li>Make sure your product price should match with whole sale market price less than all retailer price.</li>
                    <li>Product description should match with product.</li>
                    <li>Should not copy the description of your product from any other ecommerce website.</li>
                    <li>Unit should match with product.</li>
                    <li> Before adding product, choose proper category of the product you are going to be add.</li>
                </ul>
                <h5>Your Product Details:</h5>
                <ul class="nobullets">
                    <li>Product Name: Rice Flour</li>
                    <li>Product Description: XXXXXXXXXX</li>
                </ul>
            </div>
            <div class="footer" style="background:#000;padding: 1%;height:auto;width:80%;margin: 8% auto;color:#fff;box-sizing:border-box">
                <p class="text-center">&copy ABC</p>
            </div>
    </div>
        </body>
    </html>