旋转的钢笔 2017-04-20 08:56 采纳率: 54.5%
浏览 1976
已结题

怎么给使用绝对定位的div加边框

我在第二个div与第二个同级的div加了border,但是绝对定位脱离文档流了,那有没有办法使border生效,我想要这样的结果
图片说明

 <div style="width:100%; height:360px;margin:0 auto;">
        <div style="margin-left :0px;float:left;height:300px ;width: 350px;border:1px solid red">
            <div style="height:35px;width:350px;text-align:center;margin:0 auto;line-height:35px;font-size:26px;color:#2254A8;">
                <b>PRE-ARIANE</b>
            </div>
            <div style="float:left;width: 350px;height: 460px; position:relative;">
                <div style="position:absolute;left:0px;top:30px;width: 200px;height: 250px;"><div style="font-size:64px;color:#27599A;"><b>$!{ALL_LEVEL_TRAINERS}<b/></div><div>Trainees Attended</div></div>
                <div style="position:absolute;left:0px;top:200px;width: 200px;height: 250px;"><div style="font-size:64px;color:#27599A;"><b>$!{ALL_LEVEL_PASSED}<b/></div><div>Trainees Passed</div></div>
                <div style="position:absolute;left:200px;top:20px;width: 100px;height: 100px;"><div style="margin: 0 auto;" id='canvasDiv5'></div></div>
                <div style="position:absolute;left:170px;top:190px;width: 320px;height: 300px;"><div style="margin: 0 auto;" id='canvasDiv6'></div></div>
            </div>
        </div>
        <div style="margin-left :50px;float:left;height:450px ;width: 350px;border:1px solid red">
            <div style="height:35px;width:690px;text-align:center;margin:0 auto;line-height:35px;font-size:26px;color:#2254A8;">
                <b>INTERNAL TRAINERS</b>
            </div>
            <div style="float:left;width: 690px;height: 260px; position:relative;">
                <div style="position:absolute;left:0px;top:0px;width: 200px;height: 250px;"><div style="margin: 0 auto;" id='canvasDiv7'></div></div>
                <div style="position:absolute;left:400px;top:0px;width: 120px;height: 100px;"><div style="margin: 0 auto;" id='canvasDiv8'></div></div>
                <div style="position:absolute;left:400px;top:230px;width: 120px;height: 100px;"><div style="margin: 0 auto;" id='canvasDiv9'></div></div>
            </div>
        </div>
</div>
  • 写回答

2条回答 默认 最新

  • wjq-xxq 2017-04-20 10:58
    关注

    可能是你用了绝对定位之后,再加上边框,超出了div的width和height,没有仔细看你的代码,太多了,另外,能不使用绝对定位的尽量不要使用,想在上方添加点代码的话,整个页面都要改变

    评论

报告相同问题?

问题事件

  • 已结题 (查看结题原因) 12月24日

悬赏问题

  • ¥15 有兄弟姐妹会用word插图功能制作类似citespace的图片吗?
  • ¥200 uniapp长期运行卡死问题解决
  • ¥15 请教:如何用postman调用本地虚拟机区块链接上的合约?
  • ¥15 为什么使用javacv转封装rtsp为rtmp时出现如下问题:[h264 @ 000000004faf7500]no frame?
  • ¥15 乘性高斯噪声在深度学习网络中的应用
  • ¥15 关于docker部署flink集成hadoop的yarn,请教个问题 flink启动yarn-session.sh连不上hadoop,这个整了好几天一直不行,求帮忙看一下怎么解决
  • ¥15 深度学习根据CNN网络模型,搭建BP模型并训练MNIST数据集
  • ¥15 C++ 头文件/宏冲突问题解决
  • ¥15 用comsol模拟大气湍流通过底部加热(温度不同)的腔体
  • ¥50 安卓adb backup备份子用户应用数据失败