CSS - 样式冲突

Question

在我目前的项目中，我使用供应商的javascript插件。它拥有自己的CSS。但是当我添加Foundation时，它打破了这个插件的外观。 没有基金会：

有了基金会：

我该如何解决？我能否在插件对象上忽略样式，而不是它自己的特定样式？

更新

我的css声明列表：

<link rel="stylesheet" href="/css/foundation.min.css" />
<link rel="stylesheet" href="/css/custom.css" />
<link rel="stylesheet" href="/css/schedule-style.css" />

插件：http://www.jqueryscript.net/time-clock/Simple-Daily-Schedule-Plugin-with-jQuery-and-jQuery-UI-Schedule.html

Answer 1

您所看到的显示问题是由于基金会使用了box-sizing: inherit。

您可以通过在自定义样式表中添加新规则来覆盖此#schedule：

#schedule {
    box-sizing: content-box;
}