2014-09-19 67 views
-2

爲什麼這兩個DIV不顯示它內聯?有什麼事情發生和第二DIV其顯示底部...內聯塊的兩個div不工作

#mac{ 
 
display: inline-block; 
 
background-color:#000000; 
 
    background-repeat: no-repeat; 
 
padding-top:130px; 
 
height:455px; 
 
width:50%; 
 
} 
 
#mac2{ 
 

 
display: inline-block; 
 
background-color:#000000; 
 
    background-repeat: no-repeat; 
 
padding-top:130px; 
 
height:455px; 
 
width:50%; 
 
}
<!doctype html> 
 
<html> 
 
    <head></head> 
 
    <body> 
 
     <div id="mac"></div><div id="mac2"><img src="images/rocket.png"><span class="textomedio">Maximizamos tu ROI</span></div> 
 
    </body> 
 
</html>

http://jsfiddle.net/XCDsu/4/

+0

它對我來說是內聯的... – 2014-09-19 14:27:35

+3

你的代碼發佈與你的jsfiddler – gunr2171 2014-09-19 14:27:38

+0

不同如果你運行腳本你可以看到沒有它的內聯 – Rom 2014-09-19 16:19:52

回答

0

您需要添加vertical-align:top;#mac2

#mac{ 
 
display: inline-block; 
 
background-color:#000000; 
 
background-repeat: no-repeat; 
 
padding-top:130px; 
 
height:455px; 
 
width:50%; 
 
} 
 
#mac2{ 
 
display: inline-block; 
 
background-color:#000000; 
 
background-repeat: no-repeat; 
 
padding-top:130px; 
 
height:455px; 
 
width:50%; 
 
vertical-align:top; 
 
}
<!doctype html> 
 
<html> 
 
    <head></head> 
 
    <body> 
 
     <div id="mac"></div><div id="mac2"><img src="images/rocket.png"><span class="textomedio">Maximizamos tu ROI</span></div> 
 
    </body> 
 
</html>

+0

什麼是一個在另一個之上?答案中的例子清楚地表明它們並排。 – j08691 2014-09-19 16:20:26

+0

它行得通,謝謝 – Rom 2014-09-19 16:25:46