0

下面是我的代码

    <div class="center" style="text-align:center;">     
    <div style="position:relative;width:26%;min-width:300px;float:left;background-color:red;border:1px solid black;"">  
    <img width=500px;height=500px; src="<?php echo $this->basePath().'/images/feat/shop/5/5_large.jpg';?>">
    </div>
    <div style="position:relative;float:left;min-width:100px;width:10%;height:500px;background-color:green;border:1px solid black;"">   
    </div>
    <div style="position:relative;width:26%;float:left;min-width:300px;background-color:blue;border:1px solid black;">  
    <img width=500px;height=500px; src="<?php echo $this->basePath().'/images/feat/shop/5/5_large.jpg';?>">
    </div>
    </div>

上面带有类的 divcenter是位置left侧,但我想在不使用Margin, padding,left right 属性的情况下将其准确定位在屏幕的中心,如您所见,我已经尝试使用 'text-align' 但没有用,这可能吗?

4

1 回答 1

0

尝试这样做:

<div class="center" style="position: absolute; top: 50%; left: 50%;">     
...

或者为了使其更准确,请尝试使用以下calc()功能:

<div class="center" style="position: absolute; top: calc(100%/2 - divHeight/2); left: calc(100%/2 - divWidth/2);">     
....

根据您的说法,您没有使用margin,因为当您将窗口大小减小到尽可能小的时候,div 不会向左移动。好吧,这是我的答案,使用marginwithpixels做你所关心的事情,但使用marginwithpercentage(%)将帮助你实现你想要的。

使用百分比: 使用百分比并不难,但单位与像素不同。如果您希望您的 div 位于中心。

尝试这样做:

margin: 0 auto;

或这个:

margin: 0 calc(50% - divWidth/2);

这肯定会帮助你实现你想要的。

希望它有所帮助。

于 2013-07-12T10:41:51.880 回答