gpt4 book ai didi

css - 两个div并排-一个在最左边,另一个在中间

转载 作者:太空宇宙 更新时间:2023-11-04 15:52:03 24 4
gpt4 key购买 nike

我正在创建一个 WP 主题,它在页面中间有两个部分。左边是“最近的工作”,右边是“最近的博客文章”。我希望“最近的博客文章”从页面中间开始;它的左边缘与容器的水平中点对齐。我还希望有一条垂直线将两者分开。我玩过边距和填充,但似乎无法达到我想要的效果。这是我想要的图片: ideal

<div id="recent">
<div id="recent-work">
<p><span>Recent Work</span></p>

<div class="next">
<a href="#"><img src="img/next.png" alt="Click for more information" /></a>
</div><!-- end next -->
</div><!-- end recent-work -->
<div id="recent-blog">
<p><span>Recent Blog</span></p>

<div class="next">
<a href="#"><img src="img/next.png" alt="Click for more information" /></a>
</div><!-- end next -->
</div><!-- end recent-blog -->
</div><!-- end recent -->

#recent {
border-top: 1px solid #202020;
padding-bottom: 40px;
padding-top: 40px;
}

#recent #recent-work {
float: left;
}

#recent #recent-work .next{
float: right;
}

#recent #recent-work p span {
font-family: nevis-webfont;
font-size: 112.5%;
font-weight: normal;
letter-spacing: 1px;
text-transform: uppercase;
}

#recent #recent-blog {
float: right;
}

#recent #recent-blog .next{
float: right;
}

#recent #recent-blog p span {
font-family: nevis-webfont;
font-size: 112.5%;
font-weight: normal;
letter-spacing: 1px;
text-transform: uppercase;
}

从昨天开始我就一直在努力解决这个问题,所以非常感谢任何和所有的帮助。

@普拉文 changes

最佳答案

在您的 CSS 中,请添加这一行:

#recent #recent-work p {text-align: center;}

更新:

我添加了这个:

#recent #recent-work p, #recent #recent-blog p {text-align: center;}

关于css - 两个div并排-一个在最左边,另一个在中间,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11084452/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com