Html CSS div block正在继承其父对象'；s属性

我在另一个

div

中有一个HTML

div

：

<div class="content">
     <div class="block">
     blabla
     </div>
     <br/>
     <div class="block">
     blabla
     </div>
     <br/>
     <div class="block">
     blabla
     </div>
     <br/>
     <div class="block">
     blabla
     </div>
</div>

谢谢

为其指定固定宽度，因为默认情况下，所有块元素都具有100%的宽度， 还可以看看法比齐奥的ans

---

“Fabrizio Calderan”ans也是R8，适用于灵活的宽度。您可以使用他的ans尝试覆盖。

块中的属性
宽度

.block{

  border-radius: 4px;
  border: 1px solid;
  background-color: #d9edf7;
  border-color: #bce8f1;
  color: #3a87ad;
  width: 10%; /* or some precise value like 40px */
}

重写意味着对父级继承的属性进行写入。如果在浏览器中使用Firebug之类的工具，您可以清楚地看到被覆盖的属性以及与之相关的新值。
尝试添加这些规则

.block {
  float: left; 
  clear: left;
  min-width: 100px; /* just to have some visual order */
}

.content {
  /* float clearing */
  height: auto; 
  overflow: hidden;
}

设置固定宽度实际上并不总是容易的（如果标签的长度大小可能不同，您以前无法定义50或100px的宽度），使用
内联块将使这些标签并排对齐（假设未使用

）

还要注意您有一个输入错误：您编写了
.bloc
而不是
.block
请检查.bloc it is.block的拼写
JSFIDLE
假设您提供的css用于上述代码，那么您应该为内容的内部div元素提供固定或灵活的宽度，如

.block{width: 50px;}

或

宽度不是从外部元素继承的，它默认为100%
每个块元素，如具有默认100%宽度的
，
。
下面是一些块元素的列表

如果希望宽度小于100%，则应为该元素指定一些固定宽度
如果不希望设置宽度，也可以尝试以下操作：

.block { display:inline-block }

这是你代码中正确的css段落吗？如果没有，检查你的拼写。他的CSS没有问题。他很可能是法国人，翻译HTML，但不是CSS。我编辑了问题（但需要先批准）编辑了问题。实际上，这不是一个拼写错误，这是法语，他可能忘了翻译（与“corpsContenu”相同）。我认为这种更新应该首先通过OP验证，以确保他的代码是正确的。事实上，设置一个小的宽度满足了我的需要
.block{width: 50px;}

.block{width:20%;}

.block { display:inline-block }