0

ポップアップを表示する Chrome 拡張機能をコーディングしていますが、コンテンツのサイズを制御できず、小さなピクセルが 1 つしか表示されません。

参照用のスクリーンショットを次に示します。

スクリーンショット

ご覧のとおり、2 つのグラデーション ピクセルはスクロール バーで、1 つの黒いピクセルは情報です。

編集:固定または相対位置で代わりに機能しますか?

    <!DOCTYPE html>
<html>
  <head>
    <title>Getting Started Extension's Popup</title>
    <style type="text/css"> 
body {
  background-color: #ffffff;
  background-image: url(images/background.jpg);
  background-repeat: no-repeat;
  font-family: MyriadPro-Regular, 'Myriad Pro Regular', MyriadPro, 'Myriad Pro', 
Helvetica, Arial, sans-serif;
}

.profile_tab {
  position: absolute;
  top: 30px;
  left: 12px;
}

.settings_tab {
  position: absolute;
  top: 124px;
  left: 12px;
}

.news_tab {
  position: absolute;
  top: 218px;
  left: 12px;
}

    </style>
    <script></script>
  </head>
  <body>
<div 
  class="profile_tab"> <img src="images/Profile_Tab.png"> 
</div>
<div 
  class="settings_tab"> <img src="images/Settings_Tab.gif"> 
</div>
<div 
  class="news_tab"> <img src="images/News_Tab.gif">
</div>


  </body>
</html>
4

3 に答える 3

0

CSSでも高さと幅を指定した空のdivを作成できました。ここで私がしたことを見ることができます:

CSS:

.content {
  width: 470px;
  height: 330px;
}

HTML:

<div class="content">  </div>
于 2013-09-16T20:35:45.623 に答える
0

コンテナに本体を含めます。高さと幅をコンテナに設定します。

//Css code
#container{
width:250px;
height:300px;
background-color:FFFFFF;
border-width:1px;
margin:0px;
padding:0px;
}

//html code
<!DOCTYPE html>
<html>
<head>
<title>Getting Started Extension's Popup</title>
</head>
<div id="container">
<body>
...
</body>
<div>
</html>
于 2013-09-17T05:21:56.940 に答える