div的位置更改仅在Firefox中

保罗·C

我想要的是:-在一行文本的末尾放置一个25px的小像素-25px的图像。我正在使用DIV(re1DOC)来放置元素,以使其更加容易。问题是:一旦我将其正确定位,它就会按照我在IE和Chrome中的显示方式显示,但是当我切换到FireFox时,文本已经稍微移动了,并且div不再位于我想要的位置。-我已经验证了我的htlm和CSS,没有任何问题。(我知道CSS中不需要width,height和background颜色属性,但这有助于我进行设置,并将在发布前将其删除。)

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;
}

如果您希望将25x25 px的小图片放置在段落的末尾,则不必像以前那样放置它。如果您检查小提琴@ http://jsfiddle.net/8botsnL0/,我所做的就是将<p>段落标签赋予最后一个段落(您尚未进行顺便说一句),然后再关闭标签(/ 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>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章