Question

I have this html code:

 <div id="maincontent">

        <div id="mainbackground"><img src="images/mainbackground.png" border="0" alt=""></div>
        <div id="illustration"><img src="images/illustration.png" border="0" alt="">

            <div id="text1" class="sloganfont">Mahmood</div>

        </div>

    </div>

c 这些干s为:

 #maincontent
 {
background:#CFCFCF;
width:100%;
height:1200px;
position:relative;
text-align:center;
margin:0 auto;
 }
 #mainbackground{
position:relative;
top:-10px;
 }
 #illustration
 {
position:relative;
top:-768px;
text-align:center;
margin:0 auto;
 }
 #text1{
height: 25px;
width:300px;
background:none;
position:relative;
top:-503px;
left:-268px;
text-align:left;
margin:0 auto;
 }

一、增加我的浏览量。然后,插图四和正文一四仍然处于中心地位,工作罚款。但是,如果在原页宽度之后减少我的浏览器,那么插图就停止移至左边,而正文1则将四舍五入。我想,案文1将四舍五入到探索者宽度低于像插图四那样的网膜。如何做到这一点? 提前感谢。

Answer 1

你们需要具体指明在适当地方的宽度,所有要素都以类似的方式做出回应,但由于你相对定位第1号正文,在屏幕尺寸小于该数额时,便会打折扣。

here s an example of it working: http://jsfiddle.net/davetayls/GgzUR/

Move the sliders to make the right area wider and smaller

Answer 2

我将假设这一点,因为案文1有具体规定的宽度,试图对其他内容 w。

友情链接