所以我有课:
awpcp-subtitle.
在此我想定位一个子元素,我可以使用它:
@media (max-width: 1920px) and (min-width: 769px) {
.awpcp-subtitle:nth-of-type(1) {
margin-top: 440px!Important;
}
}
这使我可以上下移动它。但是我想使当前浮动的文本对齐:
@media (max-width: 1920px) and (min-width: 769px) {
.awpcp-subtitle:nth-of-type(1) {
text-align: center!Important;
}
}
不起作用。
有什么想法吗?
这是html:
<div class="awpcp-subtitle">Contact Information</div>
<a href="https://adsler.co.uk/wp-user-test-dashboard-
2/awpcp-reply-to-ad/21/old-goriot-balzac/">Email
admin</a><a href="tel:<br/><label>Phone:</label>
07576335122"><div class="phone"><br/><label>Phone:
</label> 07576335122</div> </a>
<a href="http://maps.google.com/?q=:<br/>.
<label>Location:</label> Westminster, London, UK"><div
class="location"><br/><label>Location:</label>
Westminster, London, UK</div></a>
<div class="visit-website"><Visit Website:</div>
</div>
<div class="showawpcpadpage"><label>Price:</label>
<strong>£ 0.99</strong></div>
<div class="fixfloat"></div>
<div class="showawpcpadpage">
<div class="awpcp-subtitle">More Information</div>
答案 0 :(得分:0)
基本上,通过提供的链接查看页面代码后,这是重新排列HTML元素顺序的简单情况。
在div部分-showawpcpadpage部分中,您需要将awpcp副标题[联系信息]移到顶部,而不是在图像+链接下方。
<div class="showawpcpadpage">
<div class="awpcp-subtitle">Contact Information</div>
<div class="awpcp-ad-primary-image">
<a class="awpcp-listing-primary-image-thickbox-link thickbox thumbnail" href="https://adsler.co.uk/wp-content/uploads/awpcp/images/19808423-2b60d824-large.jpg" rel="awpcp-gallery-21">
<img class="thumbshow" src="https://adsler.co.uk/wp-content/uploads/awpcp/thumbs/19808423-2b60d824-primary.jpg" alt="Thumbnail for the listing's main image" width="200" height="200">
</a>
这就是HTML流的外观。
HTML的布局很重要。因此,例如,如果标头位于页面顶部,则标头的HTML也应位于页面顶部,而不是向下几个元素。