divのページサイズを80％にするにはどうしたらいいですか？

私はページコンテナdivに10％の上余白と10％の下余白を持たせたいと考えています。私はどのようにしてdivの残りの80％のページを、すべての時間（内容に関係なく）持っているようにすることができますか？divのページサイズを80％にするにはどうしたらいいですか？

出典

2010-11-30 Geo

をこれは動作するはずです：

<!DOCTYPE html> 
<html> 
    <head> 
     <style type="text/css"> 
      div { 
       position: absolute; 
       height: 80%; 
       width: 80%; 
       top: 10%; 
       left: 10%; 
       background-color: #FFCC00; 
      } 
     </style> 
    </head> 
    <body> 
     <div> 
      This should prove my point. 
     </div> 
    </body> 
</html>

出典

2010-11-30 20:07:42 tdammers

あなたは試すことができます：

CSS 
--- 
.container { 
    margin-top:10%; 
    margin-bottom:10%; 
    height:80%; 
} 

<div class="container"></div>

出典

2010-11-30 20:01:43

いいえ、これは動作しません。それはdivの上端に余白を追加しますが、高さはコンテンツに合わせるために必要なだけで、それ以上は何もありません（Firefox、HTML5モードでは少なくとも）。 – tdammers

@tdammers良い追加、私はあなたが位置、幅、上と左を追加参照してください。 @Geoすべてのブラウザでテストしてください。あなたは軽微な違いにつまずくかもしれません。ベスト –

幅と左は実際にはX軸で同じことをするボーナスです。 'position：absolute'はそのトリックです。 – tdammers

divのページサイズを80％にするにはどうしたらいいですか？

答えて

関連する問題