在不使用 的情况下换行答案

【问题标题】：Give a line break without using 在不使用 的情况下换行
【发布时间】：2013-09-02 20:52:00
【问题描述】：

我的 div 上有一个按钮。

<button id="showmenu" type="button">Show menu</button>
<div class="sidebarmenu">
    Some code
</div>

div 显示在按钮的正下方。我希望按钮以换行符显示。我知道使用  是一种不好的做法。没有它我怎么给空间？

【问题讨论】：

您能否提供您想要的屏幕截图以及针对您的问题的 jsFiddle 链接？
@Bittu 在样式中使用上边距
jsfiddle.net/8caCw 这是我的小提琴。这就是我想在不使用
的情况下做的事情
可以在没有
的情况下在 css 中使用边距。但是不要认为简单地使用
是不好的做法，它不是，在你的例子中，这将是完成你想要的最简单和最快的方法，也不是 bad 方法去做吧。查看 mattytommo 的回复。
你在找这个吗？ jsfiddle.net/8caCw/2 -@Bittu

标签： html css

【解决方案1】：

使用 css：

.sidebarmenu{
  margin-top: 20px;
}

现场示例：http://jsfiddle.net/BhsYx/

【讨论】：

没有。 - @SpaceBison OP 没有声明浮动的位置。他正在向我们展示他的代码的 sn-p，但这可能会在他的项目中被详尽地使用。所以改回浮动并清除它不一定是可行的。如果他已经使用了浮点数，那么使用 clear 进行浮点数或者我应该说 .clearfix 将是最好的解决方案。
@Nathan - 是的，我明白你在说什么，但我发表了这样的声明，因为 OP 有“没有声明的地方”any CSS - 我认为它会很流行记下通常与定位和 CSS 一起使用的其他选项。我应该在我的第一条评论中更清楚地说明这一点。

【解决方案2】：

你可以使用

#showmenu{
   margin-bottom:10px;
}

Demo

【讨论】：

【解决方案3】：

换行的正确方法是使用 。

但是，要在块元素之间放置一些空间，您可以使用 CSS 属性，例如 margin（外部）或 padding（内部）。但边距不是换行符。   表示换行，并呈现为空白。边距是渲染空白空间的另一种方式，但这并不等同，因为它不会影响相同的事物。

【讨论】：

【解决方案4】：

你可以让它成为一个块级元素...

button{
    display: block;
}

见小提琴：http://jsfiddle.net/dwBG4/

【讨论】：

【解决方案5】：

你可以试试这个：

       <button id="showmenu" type="button">Show menu</button>
       <div class="sidebarmenu" style="margin-top:20px" >
            Some code
        </div>

【讨论】：

【解决方案6】：

您可以显示阻止您的按钮

button{display:block}

【讨论】：

【解决方案7】：

在您给定的场景中，这确实不是坏习惯。当您看到类似以下内容时，这只是一种不好的做法：

<div>
</div>
<br />
<br />
<input />
<br />
<br />

但你想用它来控制文本，所以使用它！这让我想起了当你看到人们讨厌桌子时，却在 divs 上使用 display: table 和 display: table-cell！

【讨论】：

@Cherniv 那不同，OP 已经声明他可以更改标记
公平地说，div 上的表格显示模式允许您拥有一些与实际表格标签固有的不同语义。所以你可以制作一个像这样的实际表格布局。但是，是的，我同意，我根本不喜欢这种做法……