原因分析：

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. IDEA 2017 安装后 关联SVN

    IDEA 2017 安装后,SVN checkout时候会出现如下错误: Cannot run program "svn" (in directory "D:\demo\ ...

  2. python的运行机制和版本区别

    引用来自:here 解释型语言和编译型 首先,我们编程都是用的高级语言(写汇编和机器语言的大牛们除外),计算机不能直接理解高级语言,只能理解和运行机器语言,所以必须要把高级语言翻译成机器语言,计算机才 ...

  3. Orleans学习总结(二)--创建工程

    通过第一篇Orleans学习总结(一)--入门认识我们大致知道知道是干嘛的了,下面我们来动手造一个传说中的神秘的高并发集群Orleans程序. 一.创建四个C#工程 1.IGrain工程,用来定义各种 ...

  4. windows 2008 r2 不能启用网络发现

    在win2008 R2里面,不能启用网络发现,查询资料,得知需开启一下三个服务: Function Discovery Resource Publication SSDP Discovery UPnP ...

  5. mysql8.0驱动问题

    <dependency> <groupId>mysql</groupId> <artifactId>mysql-connector-java</a ...

  6. python3之文件操作

    一   打开文件   根目录在d盘的文件名为‘学习资料.txt’的文件 a)绝对路径(最开始的,根目录文件)例:    e:\学习资料.txt 相对路径   直接用文件名字 b)操作方式  只读  只 ...

  7. SVN如何忽略dll文件和bin目录

    一般来说,编译之后的结果文件都会放在bin目录下.用svn做代码管理服务器的时候,肯定不希望编译的结果文件也签入进去,因此需要在客户端配置. 在checkout目录下,在svn的子菜单中 Proper ...

  8. jQuery 选择器 筛选器 样式操作 文本操作 属性操作 文档处理 事件 动画效果 插件 each、data、Ajax

    jQuery jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方 ...

  9. React Router 用法

    React Router 用法 一.DEMO import React from "react"; import { HashRouter as Router, Route, Li ...

  10. mysql缓存分析