gpt4 book ai didi

html - 对齐方式没有在 wordpress 上正确显示

转载 作者:行者123 更新时间:2023-11-28 06:58:21 24 4
gpt4 key购买 nike

我在使用文本小部件对齐 Logo 时遇到 wordpress 问题。当我在本地或在 jsfiddle 上构建 html 和 css 时,它工作得很好,但是当我尝试在 wordpress 上复制它时,结果很有趣。这是网站 Logos on the write hand side这是我正在使用的代码 jsfiddle of code .

有人能告诉我我需要做什么才能让它在 wordpress 上看起来和在 fiddle 上看起来一样吗(I.E 两列 Logo )

<!doctype html>        
<html>
<head>
<title>Put in title</title>
<style>
.association_logos_container_left
{
max-width:140px;
float:right;
}
.association_logos_container_left .association_logos_left img
{
max-width:100px;
float:left;
margin: 5px;
display:block;
}
.association_logos_container_right {
max-width:140px;
float:right;
}
.association_logos_container_right .association_logos_right img
{
max-width:100px;
float:right;
margin: 5px;
display: block;
}
</style>
</head>
<body>




<div class="association_logos_container_left">

<div class="association_logos_left"><img src="http://www.taranoone.ie/wp-content/uploads/2015/10/TUSLA-logo.jpeg" alt="Tusla"></div>
<div class="association_logos_left"><img src="http://www.taranoone.ie/wp-content/uploads/2015/10/Turning-Point-logo.png" alt="Turning Point"></div>
<div class="association_logos_left"><img src="http://www.taranoone.ie/wp-content/uploads/2015/10/Parenting-plus.jpeg" alt="Parenting Plus"></div>
<div class="association_logos_left"><img src="http://www.taranoone.ie/wp-content/uploads/2015/10/Living-life-logo.jpeg" alt="Living life"></div>
<div class="association_logos_left"><img src="http://www.taranoone.ie/wp-content/uploads/2015/10/Incredible-years.jpeg" alt="Incredible Years"></div>
</div>
<div class="association_logos_container_right">


<div class="association_logos_right"><img src="http://www.taranoone.ie/wp-content/uploads/2015/10/IACP-logo.jpeg" alt="IACP"></div>
<div class="association_logos_right"><img src="http://www.taranoone.ie/wp-content/uploads/2015/10/HSE-Logo.jpeg" alt="HSE Logo"></div>
<div class="association_logos_right"><img src="http://www.taranoone.ie/wp-content/uploads/2015/10/DIT-logo.jpeg" alt="DIT Logo"></div>
<div class="association_logos_right"><img src="http://www.taranoone.ie/wp-content/uploads/2015/10/DCU-logo.jpeg" alt="DCU Logo"></div>
<div class="association_logos_right"><img src="http://www.taranoone.ie/wp-content/uploads/2015/10/Crawford-Art-College-logo.jpeg" alt="Crawford Art College"></div>

</div>

</body>
</html>

最佳答案

尝试在你的 CSS 文件末尾添加这个

.association_logos_container_left {
display: inline-block;
width: 50%;
}

.association_logos_container_right {
display: inline-block;
float: right;
max-width: 140px;
}

编辑

或者你可以只添加这个

.association_logos_container_left {
display: inline-block;
}

关于html - 对齐方式没有在 wordpress 上正确显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33373524/

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