Question

我想要的是： - 在一行文字的末尾放置一个25px - 25px的小图像。我使用DIV（re1DOC）来定位元素以使其更容易一些。问题是：一旦我正确定位它就像我想要的那样在IE＆amp; Chrome，但当我切换到FireFox时，文本已经移动了一点，div不再是我想要的地方。 - 我已经验证了我的htlm＆amp; CSS没有问题。（我知道我的CSS中不需要宽度，高度和背景颜色属性，但它帮助我设置了所有内容，并将在发布后删除。）

HTML：

<!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>Restless Earth</title>
<style type="text/css">
body {
    margin-left: 0px;
    margin-top: 0px;
}
</style>
<link href="CSS/RE.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="REbackground"> </div>
<div id="wordbox"> </div> 
<div id="textwrapper"> 
<p> The position of Earth’s continents has changed over time with some landmasses colliding into one another and others moving apart.  This shifting process is known as continental drift.</p> 
 <div id="world"> <img src="images/gcse images/platemovementIMG.gif" width="400" height="210" alt="plate movement"/></div>
 <p> The evidence that supports continental drift includes: the jigsaw-fit of many of the land masses, the geological and fossil finds that are the same in different continents and the scientific measurments taken more recently that prove land masses are moving toward, away and alongside eachother. Continental drift is caused by convectional cell movement in the mantle.The position of Earth’s continents has changed over time with some landmasses colliding into one another and others moving apart. </p> 

 This shifting process is known as continental drift. The evidence that supports continental drift includes: the jigsaw-fit of many of the land masses, the geological and fossil finds that are the same in different continents and the scientific measurments taken more recently that prove land masses are moving toward, away and alongside eachother. Continental drift is caused by convectional cell movement in the mantle.The position of Earth’s continents has changed over time with some landmasses colliding into one another and others moving apart.  This shifting process is known as continental drift. The evidence that supports continental drift includes: the jigsaw-fit of many of the land masses, the geological and fossil finds that are the same in different continents and the scientific measurments taken more recently that prove land masses are moving toward, away and alongside eachother. Continental drift is caused by convectional cell movement in the mantle.The position of Earth’s continents has changed over time with some landmasses colliding into one another and others moving apart.  This shifting process is known as continental drift. The evidence that supports continental drift includes: the jigsaw-fit of many of the land masses, the geological and fossil finds that are the same in different continents and the scientific measurments taken more recently that prove land masses are moving toward, away and alongside eachother. Continental drift is caused by convectional cell movement in the mantle.<div id="re1DOC"><a href="documents/gcse/REspec.docx"><img src="images/DOC.png" width="25" height="25" alt="download"  /></a>

</div>
</div>

</body>
</html>

CSS：

#REbackground {
    height: 100%;
    width: 100%; 
    min-width: 400px; 
    background-color: #F33;
    position: fixed;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
    color: #F00;
    background-image: url(../images/gcse%20images/eruption1.jpg);
}

#textwrapper {
    height: 4000px;
    width: 1100px;
    position: relative;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    padding-top: 10px;
    padding-right: 20px;
    padding-bottom: 0px;
    padding-left: 20px;
    background-color: #00F;
}

#world {
    float: left;
    position: relative;
    padding: 5px;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
    background-color: #F00;;
    width: 400px;
    height: 210px;
}

#re1DOC {
    position: relative;
    left: 400px;
    bottom: 50px;
    background-color: #0F0;
    width:25px;
    height: 25px;
}

Answer 1

如果你想让小的25x25像素图像位于段落的末尾，那么你就不必像你那样定位它。如果你检查小提琴@ http://jsfiddle.net/8botsnL0/，我所做的只是给＆lt; p>段落标记到最后一段（你没有用btw），在关闭标签之前（/ p）用你的锚标签添加图像进行链接。你不需要额外的div re1DOC。所以你的HTML看起来像，

#REbackground {
    height: 100%;
    width: 100%; 
    min-width: 400px; 
    background-color: red;
    position: fixed;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
    color: #F00;
    /*background-image: url(../images/gcse%20images/eruption1.jpg);*/
}

#textwrapper {
    height: 4000px;
    width: 1100px;
    position: relative;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    padding-top: 10px;
    padding-right: 20px;
    padding-bottom: 0px;
    padding-left: 20px;
    background-color: #cecece;
}

#world {
    float: left;
    position: relative;
    padding: 5px;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
    background-color: #F00;;
    width: 400px;
    height: 210px;
}
/*  remove this not needed as per ur requirement
#re1DOC {
    position: relative;
    left: 400px;
    bottom: 50px;
    background-color: #0F0;
    width:25px;
    height: 25px;
}
*/

<body>
<div id="REbackground"> </div>
<div id="wordbox"> </div> 
<div id="textwrapper"> 
<p> The position of Earth’s continents has changed over time with some landmasses colliding into one another and others moving apart.  This shifting process is known as continental drift.</p> 
 <div id="world"> <img src="images/gcse images/platemovementIMG.gif" width="400" height="210" alt="plate movement"/></div>
 <p> The evidence that supports continental drift includes: the jigsaw-fit of many of the land masses, the geological and fossil finds that are the same in different continents and the scientific measurments taken more recently that prove land masses are moving toward, away and alongside eachother. Continental drift is caused by convectional cell movement in the mantle.The position of Earth’s continents has changed over time with some landmasses colliding into one another and others moving apart. </p> 

<p> This shifting process is known as continental drift. The evidence that supports continental drift includes: the jigsaw-fit of many of the land masses, the geological and fossil finds that are the same in different continents and the scientific measurments taken more recently that prove land masses are moving toward, away and alongside eachother. Continental drift is caused by convectional cell movement in the mantle.The position of Earth’s continents has changed over time with some landmasses colliding into one another and others moving apart.  This shifting process is known as continental drift. The evidence that supports continental drift includes: the jigsaw-fit of many of the land masses, the geological and fossil finds that are the same in different continents and the scientific measurments taken more recently that prove land masses are moving toward, away and alongside eachother. Continental drift is caused by convectional cell movement in the mantle.The position of Earth’s continents has changed over time with some landmasses colliding into one another and others moving apart.  This shifting process is known as continental drift. The evidence that supports continental drift includes: the jigsaw-fit of many of the land masses, the geological and fossil finds that are the same in different continents and the scientific measurments taken more recently that prove land masses are moving toward, away and alongside eachother. Continental drift is caused by convectional cell movement in the mantle.<a href="documents/gcse/REspec.docx"><img src="images/DOC.png" width="25" height="25" alt="download"  /></a></p>


</div>

</body>

div的定位仅在Firefox中更改

1 个答案: