0

http://i.stack.imgur.com/XZI9d.png

上の画像では、テキストをメニューバーの左側とヘッダーの下に配置しようとしています。マージンとパディングの両方を試しましたが、うまくいきませんでした。ボタンはすべて、テキストとは別のタグ内にあります。コードは以下です。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<style>
body
{
    background-image: url(Background.gif);
    repeat: no-repeat;
    background-repeat: no-repeat;
}

div.button
{
width: 220px;
padding:0px, 0px, 0px, 30px;
border:0px;
margin:0px;
}

div.textbox
{

    border: 0 px;
    margin-top: 300 px;
    margin-left: 300 px;
    background-color: white;
    opactiy: 0.5;
    width: 600 px;



}

span
{
    width: 600 px;
    padding: 90 px, 0 px, 0 px, 250px;
    font-family: "Letter Gothic Std Bold";
    font-size: 16 pt;
    color: #99CCFF;
    top: 300px;
    left: 300px;
}
</style>
</head>


<body>

<div class = "textbox"><span>
 text text text
</span></div>

<div class = "button">
<br>
<br>
<br>
<br>
<img src="DarkLayout_03.gif" width="166" height="66" />
<br>
<br>
<br>
<img src="DarkLayout_06.gif" width="166" height="66" />
<br>
<br>
<br>
<a href="mailto:swy5105@psu.edu"><img src="DarkLayout_08.gif" width="166" height="66" /></a>
<br>
<br>
<br>
<a href = "http://notafilmnoirheroine.tumblr.com"><img src="DarkLayout_11.gif" width="166" height="66" />
<br>
<br>
<br>
<a href = "http://swy5105.tumblr.com"> <img src="DarkLayout_13.gif" width="166" height="66" /></a>
</div>



</body>
</html>
4

2 に答える 2

0

このようなことを試してください

フィドル: http://jsfiddle.net/pWurk/

あなたは使わなければならないfloat: left

それがあなたを助けることを願っています

于 2013-06-17T07:00:13.523 に答える
0

フロート左を使用してからクリアしてみてください。

于 2013-06-17T05:42:39.817 に答える