如何让浮动的子DIV在父DIV上居中(水平方向和垂直方向)

问题描述

如何让浮动的子DIV在父DIV上居中(水平方向和垂直方向)

如题:如何让浮动的子DIV在父DIV上居中(水平方向和垂直方向)

解决方案

父容器relative定位,浮动div absolute定位,left和width 50%,定高和定宽,通过margin-left和margin-top为你的-宽度和-高度的一半来实现水平和垂直进行居中

解决方案二:

http://blog.163.com/www.wxs_123/blog/static/82784664201321831746921/

解决方案三:

设置margin:auto;

时间: 2024-12-24 02:31:38

如何让浮动的子DIV在父DIV上居中(水平方向和垂直方向)的相关文章

子div在父div的相对定位css控制

 我们在设计页面的时候会遇到,子DIV要控制在父DIV内部的固定位置,而且还有图层上下的关系.这里有个小技巧. 父div的position使用relative,子div的position使用absolute,然后使用left和top进行定位. 如果子div的position使用了fixed,就不能使用left了,则改成margin-left. 这里说的不清楚,只是记录一下. 代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transition

浮动-如何让子div的内容显示不受父div的影响

问题描述 如何让子div的内容显示不受父div的影响 我有一个父级div,还有一个子级div 现在子div是一个浮动框,一般情况下是不显示的,当把鼠标放在父div的某个连接上时,子div作为浮动层显示出来 问题是父div的高度是固定的,且不能显示滚动条,不能随着子div的高度而扩展 因此我的子div显示出来之后,有一部分被父div盖住了一部分 如何让子div完全悬浮在父div上? 子div是框架自动生成的,不是我能控制的 解决方案 子div 是框架自动生成的,不是我能控制的 这个是父div吧,你

css-子div在父div中右对齐的方法。

问题描述 子div在父div中右对齐的方法. 在父div中,有多个子div,是垂直分布的,中间隔着,怎么让子div在父div或者说在其容器中向右靠?如果想还想空一点位置出来,应该怎么设置? 解决方案 <div style="height: 300px;width: 300px;background-color: yellow;padding-right: 10px;"> <div style="height: 100px;width: 60%;backgro

javascript-jsp子窗体向父窗体赋值

问题描述 jsp子窗体向父窗体赋值 function returninfo() { alert("Hello !!"); //获取用户输入的部门信息 var depinfo=document.myform.dep.value; //关键步骤.取得父窗体的document对象 alert(depinfo); 加上这段代码就执行不了关闭子窗体.删除这个子窗体就可以执行关闭子窗体, 烦请老师们看看这段代码值怎么又错吗? <!---->var doc=window.opener.d

div布局-请问怎么让div中的div在垂直方向上居中呢?

问题描述 请问怎么让div中的div在垂直方向上居中呢? 比如:下面这段代码,如何让里面的div在垂直方向上面居中呢(不好意思,实在是没有悬赏币了) .out{ width:500px; height:500px; background:blue;}.inn{ width:200px; height:200px; background:red;} 解决方案 你的inn怎么比out还大..搞反了吧..通过margin来定位.absolute定位最好,不需要考虑父容器,只需要依据自身的宽和高度来调整

子元素div高度不确定时父div高度如何自适应

每当进行页面布局时,我们都有这样的需求,就是当子元素div高度不确定时父div自适应高度,本文整理的多种方法可以解决此问题,感兴趣的朋友可以参考下   在最外层div加以下样式 height:100%; overflow:hidden; 其它方法: Div即父容器不根据内容自适应高度,我们看下面的代码:   复制代码 代码如下: <div id="main"> <div id="content"></div> </div&g

解决css中父div高度不随子div高度变化的方法

问题截图: 造成这种情况的原因是两个子div使用了float浮动属性,解决方法有两种: 1.给复层div加overflow:auto;属性即可,效果截图: 2.新建一个.clear{ clear:both}类,在kid2div下面加入<div class="clear"></div>清除一下浮动即可:

嵌套DIV:父DIV的高度不能根据子DIV自动变化的解决方案

解决   <div id="parent">   <div id="content"> </div></div> 当Content内容多时,即使parent设置了高度100%或auto,在不同浏览器下还是不能完好的自动伸展. 解决方案 当Content内容多时,即使parent设置了高度100%或auto,在不同浏览器下还是不能完好的自动伸展. 解决方案 <div id="parent">

父DIV的高度不能根据子DIV自动变化的解决方案

解决  <div id="parent"><div id="content"> </div></div> 当Content内容多时,即使parent设置了高度100%或auto,在不同浏览器下还是不能完好的自动伸展. 解决方案:<div id="parent"> <div id="content"></div> <div style=&q