问答详情
源自：12-12 宰相肚里能撑船 - 使用padding为盒子设置内边距（填充）

padding-right的问题，为什么设置padding-right的时候，文字与右边边框的距离不是按照padding-right设置的，但是padding-left就可以？

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>填充</title>

<style type="text/css">

#box1{

 width:100px

    height:100px;

    padding-right:1em;

    border:1px solid red;

}

</style>

</head>

<body>

<div id="box1">盒子1</div>

</body>

</html>


提问者：慕数据1008917 2017-01-18 15:31

个回答

  • 慕斯7436115
    2017-01-18 17:38:54
    已采纳

    文字与右边边框的距离 换个意思就是 要让文字向右漂移，也就是 padding-left的距离（它是距离左边坐标轴的距离也就是向右移动）


    0
  • 慕桂英5398140
    2017-01-18 16:41:38

    1：代码

    http://img.mukewang.com/587f264900016a7502560068.jpg

    2.使用 padding-right:1em;效果是红色框宽度变宽，红色框内的文字不会变位置.“盒子1”的右边填充1em，并不是“盒子1”距离右边框1em。“盒子1”距离右边框是100px+1em;

    padding-left：10px是文字和左边框之间填充10px宽度。所以文字位置变了


    0
  • 阿豆先森
    2017-01-18 16:08:36

    上面说了因为文字默认是从左显示的，你右边还有那么大一堆空白，再空也是看不出来，你多打几行字，再用

    padding-right就能看出效果了

    3
  • EvanThought
    2017-01-18 16:02:17

    因为文字默认是从左显示的 还需要设置text-align属性为right才可以吧

    0
  • 昆明2016
    2017-01-18 15:58:55

    因为向左填充后则向右挤一个大小；向右填充则向左挤一个大小

    1