列之间的引导填充

Question

所以我正在为朋友（http://jojorules.com/index.php/our-pillows/）创建一个页面，我有4行，每行3列。每列之间需要有80px的空间，但每行的第一列和最后一列需要与徽标/导航栏链接对齐（由底部图像上的红线表示）。

我希望80px的间距由底部图像中的蓝线/文字表示。

这些填充只会在桌面上，我稍后会添加，但我一直遇到问题，提出一种运行良好的干净方法，并坚持使用这些红线对齐。

Answer 1

列之间的空格删除第一列的左边填充和最后一列的右边填充，以使内容与导航栏对齐。

并使80px工作使用此代码段（假设您使用的是col-md-4）：

.col-md-4:first-child { padding-left: 0; padding-right: 40px; }
.col-md-4:last-child { padding-right: 0; padding-left: 40px; }
.col-md-4:nth-child(2) { padding-right: 40px; padding-left: 40px; }

注意：要使右栏上的文字与导航栏完全对齐，您必须使用text-align: justify以强制文字进行对齐。