如何防止元素因边距而断到新行？

要防止元素因边距而断到新行，可以采取以下几种方法：

1. 使用CSS的box-sizing属性：将box-sizing属性设置为border-box，这样元素的宽度和高度将包括边框和内边距，不会因为边距而导致元素断行。示例代码如下：

.element {
  box-sizing: border-box;
}

1. 使用负边距：通过给元素设置负的外边距，可以抵消元素的正外边距，从而避免元素断行。示例代码如下：

.element {
  margin-left: -10px;
  margin-right: -10px;
}

1. 使用浮动：将元素设置为浮动，可以使元素脱离文档流，不会受到其他元素的影响而断行。示例代码如下：

.element {
  float: left;
}

1. 使用inline-block：将元素的display属性设置为inline-block，可以使元素在同一行内显示，不会因为边距而断行。示例代码如下：

.element {
  display: inline-block;
}

1. 使用CSS的white-space属性：将white-space属性设置为nowrap，可以防止元素换行。示例代码如下：

.element {
  white-space: nowrap;
}

以上是几种常见的防止元素因边距而断到新行的方法，根据具体情况选择适合的方法即可。