w1s2x35 2021-05-07 21:41 采纳率: 100%
浏览 195
已采纳

css中为什么margin-right不管用?

<!DOCTYPE html>

<html lang="ch">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

    <style>

     *{

         margin: 0;

         padding: 0;

     }

       .kuai{

             width: 200px;

             height: 200px;

             border: red solid 1px;

              

             position: absolute;

             right: 0;

             left: 0;

             top:0;

             bottom:0;

             margin: auto;

            

       }

     

          .cirle2{   

         width: 200px;

         height: 200px;

         border: red solid 1px;

         border-radius: 50%; 

           position: absolute;   

           top:50%;

             left: 50%;

             transform:translate(-50%,-50%);

              margin-right: 50%; 

     }  

      

    </style>

 

</head>

<body>

   <div class="kuai">

           <div class="cirle2"></div>

   </div>

</body>

</html>

  • 写回答

5条回答 默认 最新

  • 梁什么鸭, 2021-05-08 01:23
    关注

    首先指出你的问题:

    一般都是子级元素用绝对定位,父级元素用相对定位。但你kuai 和 circle都用绝对定位?所以你是想以body为相对定位??

    再然后你说margin-right没有起作用,其实起作用了,你打开控制台查看元素,就会看到这个属性并没有被划掉,说明执行了。

    为什么没有明显效果,是因为在kuai中你设置了它的margin:auto;且left/right/top/bottom都为0 ,也就是说在kuai的border外都是kuai的margin,circle移动不了,所以你想改变circle的位置要改变绝对定位中的right

     

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(4条)

报告相同问题?

悬赏问题

  • ¥15 matlab数字图像处理频率域滤波
  • ¥15 在abaqus做了二维正交切削模型,给刀具添加了超声振动条件后输出切削力为什么比普通切削增大这么多
  • ¥15 ELGamal和paillier计算效率谁快?
  • ¥15 file converter 转换格式失败 报错 Error marking filters as finished,如何解决?
  • ¥15 ubuntu系统下挂载磁盘上执行./提示权限不够
  • ¥15 Arcgis相交分析无法绘制一个或多个图形
  • ¥15 关于#r语言#的问题:差异分析前数据准备,报错Error in data[, sampleName1] : subscript out of bounds请问怎么解决呀以下是全部代码:
  • ¥15 seatunnel-web使用SQL组件时候后台报错,无法找到表格
  • ¥15 fpga自动售货机数码管(相关搜索:数字时钟)
  • ¥15 用前端向数据库插入数据,通过debug发现数据能走到后端,但是放行之后就会提示错误