1

relative&の配置を間違えていabsoluteますが、それをクリアする方法がわかりません。 widht:auto&100%を変更しようとしましたが、何も機能しませんでした。で幅を指定する%と、div最小化で崩壊します。

現在、ページはラップトップの中央に配置されていません(他の画面解像度)。私のコードの何が問題なのですか?

html

[complete source][1] http://jsfiddle.net/X5RDL/

CSS

h1 {
    color: #fff;
        font-weight: normal;    
}
body {
    margin: 0px 10px 10px 10px;
    background: #C5DA99 url(images/img01.jpg) repeat;
    color: #787878;
        position:absolute;  
        font:15px Georgia, "Times New Roman", Times, serif; 
}
#header {
    width: auto;
    height: 100px;
        margin:15px 05px ;
    padding: 0px 50px;
    background: url(images/img02.jpg) repeat;
        position:relative;
}
#logo {
    float: right;
    width: 300px;
    margin: 0;
    padding: 13px;
    color: #FFFFFF;          
}
#menu {
    padding:30px 10px 0 30px;
         position:absolute;    
}
#menu li {
    display: inline;
      -moz-border-radius-topleft: 12px; 
      -webkit-border-top-left-radius:12px;

}
#menu li a {
    text-decoration: none;
        float:left;
        width:;
        height:20px;
    padding: 10px;
    color: black;
        font:14px Georgia, "Times New Roman", Times, serif;    
}


#menu li a:hover {
    margin-top:;
       color:#FFF;
    padding-bottom:12px; 
  text-shadow:5px 5px 5px white;
background:url(images/vline.jpg) no-repeat bottom
}

#contentbg
    {
        width:1004px;
        float:left;
            background: #FFFFFF;
    }   
#content 
      {
              padding:;
      }     
/*  contentleft  */
#contentleft
      {
        width:190px;
        float: left;
        margin:0px;
        padding:34px 0 33px 23px;
      }
/*   content middle */
#contentmid
    {
        width:500px;
        float:left;
        margin:0px;
        padding:34px 5px 33px 15px;
        background-image:url(images/vline.jpg);
        background-repeat:repeat-y; 
    }
/* content Right */
#contentright
    {
        width:240px;
        float: right;
        padding:34px 0 40px 12px;
        background-image:url(images/vline.jpg);
        background-repeat:repeat-y;
    }
/* login box */
#loginPan form
         {
               padding:5px;
               width:200px; 
               height:188px; 
              background:#FCF6E6; 
              color:#705D20; 
              position:relative; 
              border:1px dashed #BFB492; 
         }
#loginPan form label
         {
              width:91px; 
              height:22px; 
             display:block; 
             float:left;  
         }
4

1 に答える 1

1

相対配置のページ要素を使用すると、その中に子要素を絶対的に配置するためのコントロールが提供されます。

ここに画像の説明を入力

これについての詳細

このリンクの詳細 2

于 2013-03-21T04:47:46.947 に答える