html - 内联对齐 div,同时将内容从上到下保留在页脚中

标签 html css block footer

<分区>


关闭 6 年前

很抱歉,如果这是重复的,但过去一个小时我一直在四处寻找,但找不到任何有效的解决方案。

我需要为页脚从左到右排列三个 div,但 div 中的内容需要保持从上到下。这是我制作的模型的图片:

Footer Example

我试过inline-block,我试过block,我试过float,我都试过了在一起,还有很多其他的东西,我想不通。他们仍然从上到下排成一行。任何帮助将不胜感激,这里有一个包含页脚所有代码的 fiddle 。

https://jsfiddle.net/kLbtfqp6/

最佳答案

将你的CSS改成这样:

.footer {
background-color: #5c0e13;
color: white;
display: inline-block;
width: 100%;
}


.favicon {
display: block;
}

.footernav, .socialmedia {
  width:50%;
  float: left;
}
.footer img {
  width: 10%;
  display:inline-block; 
}
.footer p {
  width: 50%;
  display:inline-block;
}

关于html - 内联对齐 div,同时将内容从上到下保留在页脚中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38922758/

上一篇:javascript - 编辑列表中的相应元素

下一篇:css - 有没有可能用css做点击事件?

相关文章:

php - pdf 下载按钮在 php 中不起作用

css - 如何更改下拉菜单中插入符号的颜色?

css - 带有表格单元格问题的 float div

arrays - latex NiceMatrix : Error when using large matrices with Block-Command

swift - 如何像 Objective-C 一样在 Swift 中定义 block ?

html - 以文本居中 div

html - 如何在文本上制作一个向内倾斜的边框?

javascript - HTML Canvas 通过鼠标平移

css - Theme Wp Residence在注册页面上出现问题

html - 为什么我的下拉菜单没有显示为 block ?