0

私は自分のウェブサイトを任意の解像度で表示できるようにしようとしています.100％属性を使用してそうしたかったのですが、それがCSSで呼び出されている場合. 私が取り組んでいるウェブサイトはhttp://twitterdistrict.comuf.com/index.phpなので、私がどのような苦境に陥っているかがわかります。

私のHTMLコード:

<div id="pagewrapper">

<div id="header">
<img src="http://i48.tinypic.com/34gu1pl.png" alt="header" height="153" width="655" id="header_img" /> 

</div><!--end header-->

<div id="addverttop">

<img src="http://i50.tinypic.com/uq9et.png" alt="header" height="110" width="670" id="advert_top" /> 

<a href="https://twitter.com/danielanavarr0" target="_blank"><img src="http://i49.tinypic.com/259gzv5.jpg" border="0" alt="Image and video hosting by TinyPic" height="70px" width="70px" id="daniela"></a>


</div><!----end advertisement top--->

<div id="content">

<img src="http://i49.tinypic.com/bj8tfn.png" alt="header" height="1000" width="766" id="contents" /> 


</div>

<div id="forms">

<form action = "index.php" method = "Post">

<div id="name_input"> <label>Name:  </label><br /><input type="text" name="name" maxlength="35"  value="<?php echo "$name" ?>" /><br /><br /></div>
<div id="comment_input"><label>Comment:  </label><br /><textarea name="comment" maxlength="35" cols="25" rows="3"></textarea><br /><br /><br /></div>

<?php
require_once("solvemedialib.php");          //include the Solve Media library 
echo solvemedia_get_html("E5xjj6lyTJh605jWenbaprE1.in1rkN8");   //outputs the widget
?>

<input type="submit" name="submit" value="promote yourself" /><br />





</form>

CSS は次のとおりです。

 body { margin:0; padding:0}

  #pagewrapper{
  width:100%;
  height:1700px;
  background-color:#77cde6;
  margin-left: auto;
margin-right: auto;


  }

  #header_img{
  margin-left: auto;
margin-right: auto;
  position:relative;
  left:340px
  }

  #addverttop{

  margin-left: auto;
margin-right: auto;
position: relative;
left:240px;
  }

  #contents{

 position:relative;
 left:230px;
 top:30px;

  }

  #forms{
  position:relative;
  left:-300px;
  position:absolute;
left:320px;
top:900px;
z-index:1;
  }

  #username_word{
  position:relative;
  top: -870px;
  left: 5px;

  }

  #name{
    position:relative;
  top: -870px;
  left: 20px;

  }

  #comment{
      position:relative;
  top: -890px;
  left: 340px;

  }

  .dash{
  position:relative;
  top: -870px;
  left: 20px;

  }

  #line{
  position:relative;
  top:-970px;
  }
#followbtn{
position:Relative;
top:-915px;
left: -20px;
}

#name_input{
position:relative;
top:90px;
}

#comment_input{
position:relative;
left:190px;
top:20px;
}

#daniela{
position:relative;
left:-650px;
top:-7px;

}
4

2 に答える 2

1

シンプルな CSS プロパティ 'overflow-x' がそれを行います

overflow-x: visible;

それをページの本文と #pagewrapper に追加します

于 2012-08-13T09:25:07.160 に答える
0

これをCSSに追加します。

div {
overflow-x:hidden;
overflow-y:hidden;
}

オーバーフロー-xおよび-yスタイルは、一部のIEブラウザーでは認識されません。あなたはいくつかのjavascriptを使うことができます：

document.documentElement.style.overflow = 'hidden';  
document.body.scroll = "no";    // ie only
于 2012-08-13T10:38:16.757 に答える