原因分析：

chorme和firefox浏览器下当缩放窗口大小时，边框的计算宽度变大造成内部div宽度的计算宽度变大，外部div放不下内部div而溢出。

解决办法：

给内部div设置

box-sizing:border-box;　

对于不支持box-sizing的ie8-浏览器另写css样式解决

<!--[if lt IE 7]>

<link rel="stylesheet" href="ie7.css">

<![endif]-->

　　

外部盒模型大小固定 内部有边框div设置浮动时 缩放窗口内部div溢出的解决办法的更多相关文章

  1. 盒模型大小取决于它的padding，margin，border数值

    盒模型规定了元素框处理元素内容width与height值.内边距padding.边框border 和 外边距margin 的数值大小.边框内的空白是内边距padding,边框外的空白是外边距margi ...

  2. Web前端篇：CSS常用格式化排版、盒模型、浮动、定位、背景边框属性

    目录 Web前端篇:CSS常用格式化排版.盒模型.浮动.定位.背景边框属性 1.常用格式化排版 2.CSS盒模型 3.浮动 4.定位 5.背景属性和边框属性 6.网页中规范和错误问题 7.显示方式 W ...

  3. CSS文字，文本，背景，盒模型等记录

    文字: font-family:" "; /*设置字体*/ font-size:6px;/*设置文字字号*/ color:red;/*设置文字颜色*/ font-weight:bo ...

  4. 7.css盒模型

    所谓的盒模型,其实就是把元素当成盒子,元素里的文本就是盒子里的东西. 而根据元素的特效,其盒模型的特效也不同,下面是一些总结: 1.块级元素(区块) 所谓块级元素,就是能够设置元素尺寸.有隔离其他元素 ...

  5. CSS基础：块级元素与盒模型

    简介 在 HTML4.01 中,元素通常可以分为块级元素( “Block-level element” ) 和内联元素 ( "Inline-level element" ) 两大类 ...

  6. CSS 常用语法与盒模型分析

    CSS基础知识 CSS规则由两个主要的部分构成:选择器,以及一条或者多条声明 selector { property: value; property: value; ... property: va ...

  7. CSS概念 - 可视化格式模型（一） 盒模型与外边距叠加

    可以参考<精通CSS 高级WEB标准解决方案>第三章. 可视化格式模型 可视化格式模型要掌握的3个最重要的CSS概念是 浮动.定位.盒模型. 这些概念控制在页面上安排和显示元素的方式, 形 ...

  8. 盒模型Box Model（浮动）

    一.标准盒模型的大小:border+padding+content(width)        怪异盒模型大小:padding+border   二.display inline  默认,且变为行由内 ...

  9. 学习总结：CSS(二)块级与行级元素特性、盒模型、层模型、BUG与BFC、浮动模型

    一.元素的块级与行级特性 在CSS属性display控制元素是否及如何显示的特性,常用的值有none.inline.block.inline-block,在CSS3中还有一些新的特性状态,在这里不做讨 ...

随机推荐

  1. PHP针对中英文混合字符串长度判断及截取方法

    PHP自带的函数如strlen().mb_strlen()都是通过计算字符串所占字节数来统计字符串长度的,一个英文字符占1字节.例: $enStr = 'Hello,China!'; echo str ...

  2. Django之ORM版学员管理系统

    班级表 表结构 class Class(models.Model): id = models.AutoField(primary_key=True) # 主键 cname = models.CharF ...

  3. xml文件以及解析

    1.创建一个xml文件 <?xml version="1.0" encoding="UTF-8"?> <!-- xml:是一个可扩展的标记语言 ...

  4. linux 常用 掌握要点 详细终结

    linux 命令大全 每个开发者应该了解的 10 个 Linux 命令 1.查看正在执行的进程(Process) ps命令 Process Status 进程状态 语法: ps  [option]   ...

  5. [转] - spark推荐 - 从50多分钟到3分钟的优化

    原文地址 从50多分钟到3分钟的优化 某推荐系统需要基于Spark用ALS算法对近一天的数据进行实时训练, 然后进行推荐. 输入的数据有114G, 但训练时间加上预测的时间需要50多分钟, 而业务的要 ...

  6. （广度搜索）A - Prime Path（11.1.1）

    A - Prime Path(11.1.1) Time Limit:1000MS    Memory Limit:65536KB    64bit IO Format:%I64d & %I64 ...

  7. <a>标签中的href如何调用js代码

    在HTML中,<a>标签的href属性用于指定超链接的目标的URL.在所有浏览器中,链接的默认外观是: 未被访问的链接带有下划线而且是蓝色的 已被访问的链接带有下划线而且是紫色的 活动链接 ...

  8. 2018ACM-ICPC南京区域赛M---Mediocre String Problem【exKMP】【Manacher】

    这题就单独写个题解吧.想了两天了,刚刚问了一个大佬思路基本上有了. 题意: 一个串$S$,一个串$T$,在$S$中选一段子串$S[i,j]$,在$T$中选一段前缀$T[1,k]$使得$S[i,j]T[ ...

  9. 使用Kdenlive为视频加入马赛克特效

    Kdenlive(KDE Non-Linear Video Editor)是一种基于MLT框架.KDE和Qt的自由开源的非线性影片编辑器.其底层包含了FFmpeg,所以可以支持FFmpeg中的所有视频 ...

  10. ubuntu下安装bin文件

    从Java官网下载的安装文件,有的只有bin文件,没有.tar.gz文件. ①进入设备终端,通过sudo -s或su回车,切换到管理员用户:②输入管理员密码然后回车:③输入sudo chmod +x ...