2014-10-04 75 views
1
<style> 
    #middle .institutions 
    { 
     width:100%; 
     display:table; 
    } 
    #middle .institutions .institution 
    { 
     width:100%; 
     display:table-row; 
    } 
    #middle .institutions .institution .institution-image 
    { 
     display:table-cell; 
     width:50%; 
    } 
    #middle .institutions .institution .degree 
    { 
     display:table-cell; 
     width:50%; 
    } 
</style> 
<body> 
    <div id="middle"> 
     <div class="institutions">  
      <div class="institution"> 
       <div class="institution-image"> 
        <img src="jntuk.png" ></img> 
       </div> 
       <div class="degree"> 
        <p class="name">Rochester Institute of Technology</p> 
        <p>Master's - Information Technology</p> 
        <p>GPA:3.50</> 
        <a href="http://www.rit.edu" target="_new">www.rit.edu</a> 
       </div> 
     </div> 
    </div> 
</body> 

我不想使用浮動因爲某些原因。可一些幫助我 鏈接screenshot- https://drive.google.com/file/d/0B4FKXRWc2y_CTFRZQUhWZk9oUVU/view?usp=sharingcss顯示錶單元格使右側單元格向下移動

+0

歡迎SO。如果你能清楚地陳述你的挑戰(問題),那將是非常棒的。然後,人們將能夠幫助你。 – jazzurro 2014-10-04 00:40:21

回答

2

可以解決這個問題通過添加:vertical-align: top;

#middle .institutions .institution .degree { 
     display:table-cell; 
     vertical-align: top; 
     width:50%; 
    } 

下面是一個小提琴鏈接: http://jsfiddle.net/ayxg0x8j/

相關問題