<div class="outer">
<div class="box in1">in1</div>
<div class="box in2">
<form action = '' method="post">
<div class="calc" >
<div class="tab">
<span class="span">计算器</span>
<span>对照表</span>
</div>
<div class="inputcode" style="display: block;">
............
</div></form>
</div>
</div>
不太会html,勉强能用,但调整位置却头疼了。
in1 和in2 上下显示,并居中。
百度看了下,但效果都不好。
我自己想了个办法:
我以为在in1那个div 左边在加一个div,给它设个宽度来占位,这样in1不就可以调整到中间了吗。
可是问题是,”计算器“”对照表“ 这两行却跑到右上去了。
怎么让in1 和in2 上下显示,并居中。(span两行不能跑右上去了,它们是in2里面的,不能自己乱跑)
试了一下这样就可以了,我这种方式是outer 这个盒子是在浏览器垂直居中的
.outer {
width: 800px;
height: 600px;
position: absolute;
top: 50%;
left: 50%;
background: #fbfbfb;
margin-top: -300px;
margin-left: -400px;
}
.in1{
background-color:red;
}
.in2{
background-color:yellow;
}
谢谢,可以。
但在我的代码上面,还是有点小问题,不过调整好了。
气人的是:窗口大小一变又位置又不对了。
看不到你的class样式,如果你的两个div是要相对于整个浏览器的大小居中,并且两个div的宽度都是已知固定的,则你给你的两个div都加一句margin: 0 auto;
例如:.in1{width:100px;margin:0 auto} .in2{width:200px;margin:0 auto}
如果你只是单纯的让文本居中,在你的.box{text-align: center; }
– rose_j 6年前