股利旁邊的div圖像

我想讓貓的描述旁邊的圖像。你可以幫我嗎？

<div id='parent_div_1'> 
 
    <div class='child_div_1'> 
 
    <img src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcRYXNLuN8M8-f0TZUM9DIiMD3bNN6B8hyvlyttFrUdN423bn7ZD" alt="null" /> 
 
    </div> 
 
    <div class='child_div_2'> 
 
    <pre> 
 
     Name: Caroline 
 
     Age:1; 
 
     Gender: Female; 
 
     Weight: 3kg; 
 
    </pre> 
 
    </div> 
 
</div>

來源

2015-11-08 dummy

你有一些基本的格式和漂浮的問題，但我爲您解決！希望這是你想要的。

HTML：

<div id='parent_div_1'> 
    <div class ='child_div_1'> 
     <img src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcRYXNLuN8M8-f0TZUM9DIiMD3bNN6B8hyvlyttFrUdN423bn7ZD" alt="null" /> 
    </div> 
    <div class ='child_div_2'> 
     <p>Name: Caroline 
     Age:1; 
     Gender: Female; 
     Weight: 3kg;</p> 
    </div> 
</div>

CSS：

#parent_div_2, #parent_div_3{ 
    width:300px; 
    height:200px; 
    margin-right:10px; 
} 
.child_div_1{ 
    float: left; 
    border: 1px solid green; 
} 
.child_div_2{ 
    float: left; 
    height: 50px; 
    margin: 30px; 
    padding: 30px; 
    border: 1px solid red; 
}

CODEPEN DEMO

來源

2015-11-08 06:59:08

非常感謝你:)我要讓他們並排一段距離我margin和padding嘗試過，但我不能成功，你可以幫助我這個？ – dummy

是的！現在就開始工作。 –

固定，看到新的演示！你可以改變''.child_div_2''上的邊距來獲得你想要的距離。調整填充以獲取邊框和元素之間的距離。 –

試試這個：

CSS：

#parent_div_1 
{ 
    margin-right:10px; 
} 

#parent_div_1 img, #parent_div_1 div 
{ 
    display:inline-block; 
    vertical-align:middle; 
} 
#parent_div_1 div 
{ 
    margin-right:5px; 
    border:1px solid red; 
}

和HTML：

<div id='parent_div_1'> 
    <img src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcRYXNLuN8M8-f0TZUM9DIiMD3bNN6B8hyvlyttFrUdN423bn7ZD" alt="null" /> 
    <div>Name: Caroline; Age:1; Gender: Female; Weight: 3kg; </div> 
</div>

https://jsfiddle.net/c6242/4615/

來源

2015-11-08 07:09:40

謝謝:)我需要一些邊框間距，但它不起作用。 – dummy

股利旁邊的div圖像

回答

相關問題