在一条线上定位元素

我有移动div上内嵌div的问题。所以，代码在个人电脑的工作正常，但是当我访问我的移动网站，我只是不正确地显示div。在一条线上定位元素

图片div是在div上面的文本（应该是内联）。这不是宽度的情况，因为即使我将图像的宽度更改为只有5px，这个小图像仍然在上面不正确的旁边。

实施例：http://www.filmypodobnedo.pl/matrix/

所有事情是约的类似电影的列表来选择一个（在实施例基质），（应该内联显示的图像+文本，则该PC上工作，但无法在移动）中列出的电影。

HTML：

<div class="podobny_film"> 
<div id="zdjecie_podobne"> 
<img class="featured-project-image" width="100" height="150" alt="Filmy podobne do Equilibrium" src="http://www.filmypodobnedo.pl/photos/Equilibrium.jpg"> 
</div> 
<div id="tekst_podobne"> 
</div>

CSS：

.podobny_film { 
float: left; 
width: 80%; 
color: #555555; 
border-style: dashed; 
border-width: 1px; 
border-color: black; 
padding: 10px; 
} 
#zdjecie_podobne {  
width: 120px; 
float: left; 
} 
#tekst_podobne { 
width: 75%; 
float: left; 
font-size: 16px; 
}

来源

2013-11-14 Lethysek

添加display:inline-block到#zdjecie_podobne和#tekst_podobne

来源

2013-11-14 17:19:17 SaturnsEye

仍然不工作：/ – Lethysek

在div “podobny_film” 包含格 “zdjecie_podobne” 具有固定像素宽度和DIV“tekst_podobne “与百分比宽度。尝试为div“zdjecie_podobne”和图片使用百分比宽度，那么它不应该中断。

#zdjecie_podobne {  
width:24%; /*together with tekst_podobne that's 99% so be aware of any margins or paddings that might sum up > 100%!*/ 
float: left; 
} 

.featured-project-image { width:100%; }

来源

2013-11-14 17:23:46

这不工作：/ 我认为，它的宽度或列的大小IST问题。因为即使我将图像宽度绝对值设置为1 px，此图片像素也会停留在文本上方。 – Lethysek

这应该工作:)：

#zdjecie_podobne {  
    width: 120px; 
    float: left; 
    display:inline-block; 
    } 
    #tekst_podobne { 
    width: 75%; 
    float: left; 
    font-size: 16px; 
    display:inline-block; 
    }

来源

2013-11-14 17:33:18 Zsigoveny

仍然不工作：/ – Lethysek

在一条线上定位元素

回答

相关问题