Silverlight組件位置的CSS問題。無法設置，我想

我想要使用Silverlight簡單的內容頁面，接下來的質量要求高：頁面必須包括：用於橫幅（HTML） Silverlight組件位置的CSS問題。無法設置，我想

中心

頂部空間 - Silverlight的組成部分。他將伸展到適合頁面。
橫幅（HTML）的底部空間

看起來很容易，但我與Internet Explorer遇到問題8. Silverlight的組件具有體積小，亙古不變的伸展。在其他瀏覽器中，它的工作正常。

樣式：

<style type="text/css"> 
    html, body 
    { 
     height: 100%; 
     overflow: auto; 
    } 
    body 
    { 
     padding: 0; 
     margin: 0; 
    } 
    #silverlightControlHost 
    { 
     height: 100%; 
     text-align: center; 
    } 
</style>

HTML：

<body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0" style="overflow: hidden; 
    height: 100%; width: 100%;"> 
    <table frame="none" cellpadding="0" cellspacing="0" style="height: 100%; width: 100%; border:0px solid White; 
     padding: 0px;"> 
     <tr style="background-color: Red; height: 30px; width: 100%;"> 
      <td> 
      </td> 
     </tr> 
     <tr style="background-color: Blue; height: 100%; width: 100%;"> 
      <td> 
       <div id="silverlightControlHost" style="height: 100%; width: 100%; background-color: Black;"> 
           <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" 
        width="100%" height="100%"> 
        <param name="source" value="ClientBin/test.xap" /> 
        <param name="onError" value="onSilverlightError" /> 
        <param name="background" value="white" /> 
        <param name="minRuntimeVersion" value="4.0.50401.0" /> 
        <param name="autoUpgrade" value="true" /> 
        <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.50401.0" style="text-decoration: none"> 
         <img src="http://go.microsoft.com/fwlink/?LinkId=161376" alt="Получить Microsoft Silverlight" 
          style="border-style: none" /> 
        </a> 
       </object> 
       <iframe id="_sl_historyFrame" style="visibility: hidden; height: 0px; width: 0px; 
        border: 0px"></iframe> 
       </div> 
      </td> 
     </tr> 
     <tr style="background-color: Red; height: 30px; width: 100%;"> 
      <td> 
      </td> 
     </tr> 
    </table> 
</body>

鉻（完美的作品）：

alt text

IE8（不太好）：

alt text

它有什麼問題？如何解決它？

來源

2010-09-18 Evgeny

標識使用表格排版望而卻步，但是那只是我:)

首先，我將創建一個控股DIV的佈局，兩個div的頂部和底部，其間Silverlight控件主機DIV，像

<div id="container"> 
    <div id="top"> 
    </div> 
    <div id="silverlightControlHost"> 
     <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" 
      width="100%" height="100%"> 
      <param name="source" value="ClientBin/SilverlightApplication1.xap" /> 
      <param name="onError" value="onSilverlightError" /> 
      <param name="background" value="white" /> 
      <param name="minRuntimeVersion" value="4.0.50826.0" /> 
      <param name="autoUpgrade" value="true" /> 
     </object> 
     <iframe id="_sl_historyFrame" style="visibility: hidden; height: 0px; width: 0px; border: 0px"></iframe> 
    </div> 
    <div id="bottom"> 
    </div> 
</div>

你需要做的是開關的位置絕對在silverlightControlHost類，並調整延到頁面的控制，留在頂部和空間底部的HTML DIV容器像

#silverlightControlHost 
{ 
    position: absolute; 
    top:30px; 
    bottom:30px; 
    left:0px; 
    right:0px; 
    text-align:center; 
}

和繼承人的CSS類爲其他的div

#top 
{ 
    height:30px; 
    width:100%; 
} 

#bottom{ 
    height:30px; 
    width:100%; 
    bottom:0px; 
    position:absolute; 
} 

#container 
{ 
    height: 100%; 
    width:100%; 
}

希望幫助

編輯

人們發現底部並沒有定位在底部:)

#bottom{ 
    height:30px; 
    width:100%; 
    bottom:0px; 
    position:absolute; 
}

來源

2010-09-18 14:26:24

謝謝，快速回復。它確實節省了很多時間。對不起，也許這樣簡單的問題，但我新的HTML。非常感謝。 – Evgeny 2010-09-18 14:45:09

很高興幫助:) – 2010-09-18 14:57:19

我設置背景顏色：紅色;並注意到，該底部的容器實際上不在屏幕的底部。 :(我怎樣才能把它往下移動？ – Evgeny 2010-09-19 17:10:32

Silverlight組件位置的CSS問題。無法設置，我想

回答

相關問題