html - 两列 - 图像、文本 - 对齐不起作用

标签 html css

我不知道我做错了什么......

我在 CSS 中有这个:

.teamblock {
    position: relative;
}
.teamimage {
    float:left;
    width:20%
}
.teamtext {
    float: left;
    padding: 10px;
    width:60%;
}

在html中,我的结构如下:

<div class="teamblock">
    <div class="teamimage">
        <img src="some image">
    </div>
    <div class="teamtext">
        Some text
    </div>
</div>

起初它似乎工作正常。但是请看这里:

http://dev.pfp-consortium.org/index.php/about/meet-our-team

我不知道这是怎么可能的...

谢谢!

最佳答案

这也适用于白色宽度

所以你有:

.teamblock{
position: relative;
display: inline-block;
overflow: hidden;
margin: 5px;
width: 100%;
background: #ffffff;
}

它对我有用,请参阅: enter image description here

关于html - 两列 - 图像、文本 - 对齐不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27423525/

相关文章:

javascript - 如何允许输入的数字类型有空格和逗号

css - 为 ie6 调试灯箱 ul

javascript - 如何从 js 制作蒙版 svg 动画?

php - 根据分辨率计算拇指数

javascript - 用键盘控制 JavaScript 幻灯片

css - ember-paper 中的侧边栏布局不起作用

javascript - 确保异步脚本的回调

html - 纯 HTML 中的水平条

jquery - 使用 Javascript (jQuery) 遍历所有文本区域

javascript - 如何知道 HTMLTableDataCellElement 的整个文本被选中