div+css中 四个图片在一行中间距相等，左右靠两边
.grid {
position: relative;
clear: both;
margin: 0 auto;
max-width: 100%;
list-style: none;
text-align: center;
font-family:"Microsoft YaHei";
}
.grid figure {
position: relative;
float: left;
overflow: hidden;
margin: 6px 6px 6px 0px;
min-width: 355px;
max-width: 355px;
max-height: 400px;
width: 48%;
height: auto;
background: #3085a3;
text-align: center;
cursor: pointer;
}
.grid figure img {
position: relative;
display: block;
min-height: 100%;
max-width: 100%;
opacity: 0.8;
}
margin: 6px 6px 6px 0px; 这个间距无法实现，右边会多出6px。我想让四张图片的中间两张间距宽点，左右靠两边的。而不是多出6px 最近经常遇到这问题，求解决。
请直接给出可用CSS 别扯那些不着边的建议
*{margin:0;padding:0;}
ul{list-style-type:none;}
.grid{width:1000px;border:1px solid blue;height:45px;}
.grid ul{width:1008px;margin-left:-5px;}/*【主要】宽度要可以容纳四个盒子，可以比父盒子大，margin-left用负的清除掉左边的边距*/
.grid ul li{float:left;width:240px;margin:5px;border:1px solid red;height:32px;}
</style>
<div class="grid">
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
。。。。。。。。。。。。
追答<!doctype html><html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
<style>
.list{
margin: 50px auto;
border: 1px solid #ddd;
position: relative;
width: 1000px;
}
.list div{
display: inline-block;
padding: 20px 50px;
margin: 60px;
border: 1px solid #bbb;
}
.list div:first-child{
margin: 60px 120px 60px 0;
}
.list div:last-child{
margin: 60px 0 60px 120px;
}
</style>
</head>
<body>
<div class="list">
<div>ss</div>
<div>ss</div>
<div>ss</div>
<div>ss</div>
</div>
</body>
</html>
简单的demo
建议这个东西是给你思路，demo是给你做
本回答被网友采纳那就没有任何间距。
追答你可以用内间隙，调啊
div+css中 四个图片在一行中间距相等,左右靠两边
padding:20px; margin:20px auto;text-align:justify;} .box .list{ width:120px;display:inline-block;padding-bottom:20px;text-align:center;vertical-align:top;background-color: #fff;} .justify_fix{display:inline-block; width:100%; height:0; overflow:hidden;} 这个是俩段对齐的例子 ...
在css中如何设置让几个块上下左右都有相同的边距
把类名集中在一起：.class-1 .class-2 .class-3 .class-4{这里是四个类共同拥有的属性;} 这样就可以一次设置4个div的共同属性了！对于各自私有的属性可以调用ID设置；两者互不影响！
用CSS+DIV如何做出文字环绕图片左右的效果?
给图片加一个 float:left属性 然后在最后一个div后边加一个clear:both;
div一行四列布局如何做到间距相等
其实，如果只有一行的话，最后一个设置float:right也是可以的。如果还有很多行的话，就只能在用特殊的方法了 例如：总宽800px，分4列，间距10px (800px-3*10px)\/4=192.5 由此得出每个div的宽度为大约192px；css定义div的margin-right：10px（右边距） margin-left：0px（即靠左边了）然后特定一...
dw中,div里面的文字要与这个div上下左右相隔4个像素。至少左右要一样...
文字与div相隔4个像素的CSS代码就是 padding:4px 不过在浏览器中显示出来的时候，只有左边和上边是相隔4像素；1、因为字符从左往右排，排到最右边的时候，可能剩下2像素，但一个字符可能需要5像素，这时就会排到下一行，这一行就有2像素的空白，再加上你定义的4像素，就是6像素；2、因为字符有行距...
我用CSS+DIV布局我想让四个图片上面两个,下面两个排列该怎样弄_百度...
<Style>#content {width:400px; height:auto;}#content img {width:200px; height:200px;}#TOP_left {width:200px; height:200px; float:left;}#TOP_right {width:200px; height:200px; float:left;}#foot_left {width:200px; height:200px; float:left;}#foot_right {width:200px...
全部积分求解!div+CSS图片居中与多行多列排列
<style type="text\/css"> { padding:0;margin:0;} outer{ margin:50px 50px 0 50px;padding:50px;border:solid 1px #CCC;text-align:center } info{ margin:0 50px;text-align:left;padding:3px;background:#999;font-size:12px;} img{ width:100px;padding:10px;border:none } <\/...
div 加 css 中怎么实现 左边是图片 右边是文字 且文字可以自动换行...
你好 可以先给图片一个左浮动 float:left ;使其图片浮动到左侧 然后div也给一个左浮动 float:left ；让其div浮动到图片的右侧（未知总的div的宽度 不建议使用右浮动）这样定位就完成了 下一步设置字体的自动换行 word-wrap:break-word;word-break:break-all 然后直接设置margin就行了 ...
DIV+cSS同一行左右对齐
文字左右对其，同一行，表格两列是最好的，分别用align left right实现，当然也可以用两个div一个左浮动，一个右浮动，并且分别设置text-align属性就可以了，浮动元素不要设置padding和margin属性，否则会浮动边距加倍错误。我说的是DIV的高度自适应父容器的高度，不知道你说的页面自适应高度怎么理解，如果...
div+css div内多个图片显示在一行
\/\/ DIVCSS5提示：10px代表间距，第二个20代表滚动速度 });<\/script> <\/head> <body> <div id="mrq"> <!-- HTML注释 divcss5提示：特效DIV开始 --> <div id="Marquee_x"> <ul> <li> <div> <a href="http:\/\/www.divcss5.com\/" target="_blank"><img src="images\/i1.jpg"...
