0

画面にうまく収まりながら電話で表示できるWebアプリを作成しています。これまでのところ、それぞれの webapp の CSS を変更して試しました。最初は、ドロップダウンリストボックスに任意の選択を行う以下のようにうまく収まります。

ここに画像の説明を入力

ただし、画像/テキストで塗りつぶされた選択を行うと、レイアウトが大幅に変更されます。

ここに画像の説明を入力

これは、以下に示すように ContentPlaceHolder である親レイアウトのサイズを変更する私の CSS コードです。

#ContentPlaceHolder
{
  position:absolute;
  margin:0px;
  width:100%;
  left:0px;
}

このタグを介してマスターページにこの contentplaceholder css 属性を挿入しました

<div id="ContentPlaceHolder"></div>

以下のすべての詳細のレイアウトは、headerbody として分類されます。

#headerbody
{
  margin-top:50px;
  position:absolute;
  left:0%;
  margin: 0px;
  width:100%;


}

画像に示されている 3 つのテキスト ボックスには、以下に示すように width:100% 属性もあります。

<asp:TextBox ID="txtOR" runat="server" ReadOnly="True" TextMode="MultiLine" Height="80px" Width="100%"></asp:TextBox>

私の知る前に、contentplaceholder である親レイアウトが 100% である限り、画像は 100% を超えて拡張されるべきではありませんか? 私のデスクトップでは完全に動作しますが、オペラ エミュレータでは動作しません。誰かがこれについて私に教えてくれれば幸いです。

よろしく。

更新 画像に固定したサイズを小さくすることで、モバイルエミュレーターにうまく固定されます。ただし、画像が少し小さすぎます。5 つの画像すべてを画面にうまく収めることはできますか?

4

2 に答える 2

0 
#ContentPlaceHolder
{
  position:absolute;
  margin:0px;
  width:100%;
  left:0;
  right:0;
}
于 2013-07-17T07:16:46.140 に答える