Css 使用特定效果对齐列(右/左)

Css 使用特定效果对齐列(右/左),css,bootstrap-4,Css,Bootstrap 4,我正在学习CSS,我正在集成一个设计模板(PSD) 我在一个小地方卡住了,我必须对齐4列,2列在左边和2列在右边 问题是右边的两列应该比左边的两列稍微低一点。(参见图片) 我在寻找解决办法。。。但是我没有准确地找到我要找的东西 我尝试了很多东西(bootstrap,margintop…等等),但我认为有一个更合理的解决方案。。。 你能帮我吗 先谢谢你 我的代码: 。我们的方法{ 高度:适合的内容; 高度:-可使用webkit填充; 背景颜色:米色; } .我们的方法内容{ 最大宽度:730p

我正在学习CSS,我正在集成一个设计模板(PSD)

我在一个小地方卡住了,我必须对齐4列2列在左边2列在右边

问题是右边的两列应该比左边的两列稍微低一点。(参见图片)

我在寻找解决办法。。。但是我没有准确地找到我要找的东西

我尝试了很多东西(bootstrap,margintop…等等),但我认为有一个更合理的解决方案。。。 你能帮我吗

先谢谢你

我的代码:

。我们的方法{
高度:适合的内容;
高度:-可使用webkit填充;
背景颜色:米色;
}
.我们的方法内容{
最大宽度:730px;
保证金:自动;
}
.我们的方法内容p{
边界半径:10px;
}
.我们的方法内容{
背景色:卡德蓝;
填充:20px;
边界半径:10px;
利润率:10px;
}

我们的方法
我们怎么做

Lorem Ipsum只是印刷和印刷的虚拟文本
排版业。Lorem Ipsum一直是该行业的佼佼者
16世纪以来的标准虚拟文本,当
印刷工拿起一个铅字槽,把它拼凑成一个铅字
样本书。

Lorem Ipsum只是印刷和印刷的虚拟文本 排版业。Lorem Ipsum一直是该行业的佼佼者 16世纪以来的标准虚拟文本,当 印刷工拿起一个铅字槽,把它拼凑成一个铅字 样本书。

Lorem Ipsum只是印刷和印刷的虚拟文本 排版业。Lorem Ipsum一直是该行业的佼佼者 16世纪以来的标准虚拟文本,当 印刷工拿起一个铅字槽,把它拼凑成一个铅字 样本书。

Lorem Ipsum只是印刷和印刷的虚拟文本 排版业。Lorem Ipsum一直是该行业的佼佼者 16世纪以来的标准虚拟文本,当 印刷工拿起一个铅字槽,把它拼凑成一个铅字 样本书。


如果您将两人一组放入一个额外的div中,然后进行上下边距调整,应该会更容易一些

例如:


左上角

左下角

右上角

右下角


当然,您可以在引导或任何其他方式中显示它。 在引导中,您可以使用以下代码:


标题一
标题二

标题三 标题四
如果您能提供代码的相关部分,将使您的工作更轻松。谢谢Ozan Erdal!成功了!没有列:)您的解决方案更简单:)