Html 如何强制边距为0？_Html_Css

Html 如何强制边距为0？

html css

Html 如何强制边距为0？,html,css,Html,Css,我的html和css如下所示： <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>Data</title> <style type="text/css"> body {

我的html和css如下所示：

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>Data</title>
        <style type="text/css"> 
            body {  
                font-family: 'Arial';
                font-size: 9px;
                margin-bottom: 100px;
            }
            div.global{
                width: 100%;
                font-size: 12px;
            }
            div.left {
                float: left;
                width: 50%; 
                text-align: center;
            }
            div.right {
                margin-left: 80%;
            }
            div.center {
                margin-left: 35%;
                width: 485px;
                text-align: center;
                font-size: 12px;
            }
        </style>
    </head>
    <body>
        <div class="global">
            <div class="left">
                <div style="width: 80mm; margin-left: -15px !important;"> 
                    data.... <br>
                    test....
                </div>
                <hr style="max-width: 80mm; margin-left:0; height:1px; border:none; color:#333;background-color:#333;">
            </div>
            <div class="right">
                <div style="width: 80mm; margin-right: 0 !important"> 
                    <table>
                        <tr style="padding-right:35px">
                            <td>Lamp</td>
                            <td align="right">test 1</td>
                        </tr>
                        <tr>
                            <td>No</td>
                            <td align="right">test 2</td>
                        </tr>
                        <tr>
                            <td>Date</td>
                            <td align="right">test 3</td>
                        </tr>
                    </table>
                </div>
                <hr style="max-width: 80mm; margin-left:0 height:1px; border:none; color:#333;background-color:#333;">

            </div>
        </div>  
        <div class="center">
            data 1 2 3<br>
            data 4 5 6
        </div>          
    </body>
</html>


资料
正文{
字体系列：“Arial”；
字体大小：9px；
边缘底部：100px；
}
全球分部{
宽度：100%；
字体大小：12px；
}
左分区{
浮动：左；
宽度：50%；
文本对齐：居中；
}
右分区{
左缘：80%；
}
分区中心{
左边缘：35%；
宽度：485px；
文本对齐：居中；
字体大小：12px；
}
数据

测试。。。。

灯
测试1
不
测试2
日期
测试3

数据1 2 3

数据4 5 6

<div style="width: 80mm; margin-right: 0 !important">

我想在最右侧显示表格（类中的表格=右侧）

我试着

<div style="width: 80mm; margin-right: 0 !important">

<div style="width: 80mm; margin-right: 0 !important">

但身份证不起作用

有人能帮我吗

更新

演示是这样的：

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>Data</title>
        <style type="text/css"> 
            body {  
                font-family: 'Arial';
                font-size: 9px;
                margin-bottom: 100px;
            }
            div.global{
                width: 100%;
                font-size: 12px;
            }
            div.left {
                float: left;
                width: 50%; 
                text-align: center;
            }
            div.right {
                margin-left: 80%;
            }
            div.center {
                margin-left: 35%;
                width: 485px;
                text-align: center;
                font-size: 12px;
            }
        </style>
    </head>
    <body>
        <div class="global">
            <div class="left">
                <div style="width: 80mm; margin-left: -15px !important;"> 
                    data.... <br>
                    test....
                </div>
                <hr style="max-width: 80mm; margin-left:0; height:1px; border:none; color:#333;background-color:#333;">
            </div>
            <div class="right">
                <div style="width: 80mm; margin-right: 0 !important"> 
                    <table>
                        <tr style="padding-right:35px">
                            <td>Lamp</td>
                            <td align="right">test 1</td>
                        </tr>
                        <tr>
                            <td>No</td>
                            <td align="right">test 2</td>
                        </tr>
                        <tr>
                            <td>Date</td>
                            <td align="right">test 3</td>
                        </tr>
                    </table>
                </div>
                <hr style="max-width: 80mm; margin-left:0 height:1px; border:none; color:#333;background-color:#333;">

            </div>
        </div>  
        <div class="center">
            data 1 2 3<br>
            data 4 5 6
        </div>          
    </body>
</html>

这不是

右边距的作用<代码>右边距

仅为元素的右侧提供边距。尝试检查chrome/firefox开发工具中的元素，查看添加边距的位置

假设您的

global

类跨越页面宽度，您可以给出

global

：

position: relative;

和

右侧

：

position: absolute;
right: 0;

有关定位的更多信息。

您可以使用flex来正确发送内容

<div style="width: 80mm; display:flex; justify-content: flex-end">

我很感激这是一篇较老的文章，我还没有根据您提供的代码对其进行测试（因此我不能保证它在这个阶段适用于您给定的场景）但我正在研究一种解决方案，通过

右边距

将相对元素强制到右手边，并发现了这一点：

.element {
  margin-left: auto;
  margin-right: 0;
}

这里的示例代码笔

不管怎样，我希望你得到了解决。如果你能分享你的解决方案，那就太酷了，因为上面的答案都没有被接受

请看我的jsfiddle，我仍然不确定您到底想要实现什么。你们真的不应该用边距来定位，阅读上面的位置。我稍微调整了一下你的小提琴，应该给你一个开始的地方：它没有显示任何东西。你可以在jsfiddleit中尝试它工作！！到目前为止，你的答案是我发现的唯一一个提到

左边距：auto

。因为没有它，

marginright

对我来说根本不起作用。