2 ying83811 ying83811 于 2016.03.01 18:12 提问

css的div宽度多了一部分
css

样式布局

一致找不到蓝色背景下的那个3px的粉红色背景是咋个产生的,望高手赐教啊,小弟感激不尽

附上源码:

 <!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<style>
html,div{margin:0px;padding: 0px;}
</style>
</head>
<body style="width: 600px;padding: 0px;margin: 0px auto 0px;background-color: transparent;">
<div class="content" style="display: inline-block;width: 600px;background-color: pink;">

    <div class="right" style=" vertical-align: top;
    text-align: center; line-height: 30px;background-color:
    red;height: 30px;display: inline-block;">
        右边根据内容决定宽度
    </div>
    <div>
    <div class="left"  style="background-color: blue;
    width: 100%;height: 30px;display: inline-block">

    </div>
    </div>
</div>
</body>
</html>

3个回答

qq_27704715
qq_27704715   2016.03.01 18:19

你试试改一下body里面的那个margin属性,看看是否可以

ying83811
ying83811 不行啊,我都是把margin这些清除了的
2 年多之前 回复
ying83811
ying83811 不行啊,我都是把margin这些清除了的
2 年多之前 回复
ying83811
ying83811 不行啊,我都是把margin这些清除了的
2 年多之前 回复
ying83811
ying83811 不行啊,我都是把margin这些清除了的
2 年多之前 回复
ying83811
ying83811 不行啊,我都是把margin这些清除了的
2 年多之前 回复
sinat_32761163
sinat_32761163   2016.03.02 16:38

难道不是因为蓝色的div高度不够吗?

ying83811
ying83811 底部的粉红色的背景是高度自动的,怎么多了些?
2 年多之前 回复
lml_little
lml_little   2016.03.08 11:08

你用的display:inline-block这个属性,这个属性是会留一些空白的,除非你加font-size: 0px;这个。

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
css+div中的百分比自适应宽度格局
css+div中的百分比自适应宽度布局       在css页面布局中,我们常常会遇到适应显示器分辨率的问题,目前主流的1440*900,笔记本中主流的1280*800,目前上网本的1024*600,还有一些老的17寸1024*768。甚至还有一些追求最新的,用的更大的显示器。我们要让自己网站在各种分辨率下都显示正常,达到最理想的显示效果。就需要让自己的网站自适应显示器的宽度。 一
苹果,谷歌浏览器对设置了100%的DIV层宽度不能自适应,部分网页被隐藏,解决办法!
最近客户反映网页在Ipad上无法正常访问,研究再三,发现问题 因为外层container宽度为100%, google和apple无法自适应,需要加入以下属性 .container{ width:100%; height:100%; overflow:hidden; zoom:1; background:url(../img/nav_bg.jpg) repeat-x 0px 153px;min
CSS解决部分浏览器块状元素由于边框占用一定宽度导致换行的问题
在用CSS布局时,部分浏览器的块状元素边框占用了一定宽度,即使border设为none,也无法解决。 这时会导致在同一个水平上的多个块状元素宽度超过了父元素的宽度而出现换行。 遇到此类问题,解决方法是利用margin-left属性进行调节。
两个div,知道其中一个div的高度或宽度,怎么使另一个div占满剩余的部分.
解法之一:如下例子(以占满整个高度为例  ):&amp;lt;div calss = &quot;ab&quot;&amp;gt;        &amp;lt;div class=&quot;a&quot;&amp;gt;div元素a&amp;lt;/div&amp;gt;        &amp;lt;div class=&quot;b&quot;&amp;gt; div元素b&amp;lt;/div&amp;gt;&amp;lt;/div&amp;gt;      &amp;lt;style&amp;
CSS----获取DIV的高度和宽度
 我用JS动态创建了一个DIV,用CSS定义了他的样式,包括了WIDTH和HEIGHT,但是用element.style.width得到的是“未定义”,查阅资料,应该用element.clientWidth和element.clientHeight来获取。
[ CSS ] div宽度自适应!
偶尔朋友得一题目,关于div的宽度自适应. 原文出处:http://chaoqunz.blog.163.com/blog/static/6154877720096308422202/ 感谢原创作者! 1.宽度自适应的条件 自适应宽度的层不要指定宽度和float属性 自适应宽度的层物理的位置放在最下面 自适应的div中不能出现“width=100%”,否则在ie6中会出现错位现象,i
HTML+CSS相对宽度和绝对宽度冲突时的div解决方法
一般我们在使用绝对宽度时会使用px,相对宽度时会使用%,但是要是同时使用绝对宽度和相对宽度时该怎么办呢?
设置div高度等于动态宽度
项目中有时候会遇到这个问题:一行有3个div,希望这3个div平分屏幕宽度,并且高度等于宽度。 第一个问题:平分屏幕宽度 可以对div设置百分比宽度,而不是直接用px宽度,这里用到了响应式设计的思想,可以参考这篇文章:自适应网页设计(Responsive Web Design) 第二个问题:动态设置高度和宽度一致 有两种方法,一种是用js动态设置,一种是直接用CSS设置 先看下html代码
css实现左边div固定宽度,右边div自适应撑满剩下的宽度
(1)使用float class="use-float"> .use-float>div:first-child{ width:100px; float:left; } .use-float>div:last-child{ overflow:hidden; } - - - - - - - - - - - - - - -
div里放图片,有的浏览器底部会多出5px
图片增加这个样式: display: block;