<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
#a1
{
width: 100px;
height: 100px;
float: left;
background-color: Yellow;
}
#a3
{
width: 100px;
height: 100px;
float: right;
background-color: Blue;
}
#a2
{
width: auto;
margin:0 100px;
height: 100px;

background-color: Green;
}
#all
{
min-width:370px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div id="all" style="width: 100%">
<div id="a3">
a3
</div>
<div id="a1">
a1
</div>
<div id="a2">
a2546464564646465ty
</div>
</div>
</form>
</body>
</html>

html div 宽度随着浏览器自动适应的更多相关文章

  1. CSS实现超出DIV宽度文字自动隐藏并显示省略号

    当文字超出DIV宽度时,超出的文字部分省略,并用显示省略号代替,css代码如下: div.ellipsis { padding-left: 5px; text-align: left; text-ov ...

  2. DIV+CSS布局问题：一个宽度不确定的DIV里面放三个水平对齐的DIV，左右两个DIV宽度固定为150px，中间那个DIV充满剩余的宽度

    一个入门的DIV+CSS布局问题:一个宽度不确定的DIV里面放三个水平对齐的DIV,左右两个DIV宽度固定为150px,中间那个DIV充满剩余的宽度. 说明:代码非真实情况下使用,所以直接简单. 没耐 ...

  3. CSS控制div宽度最大宽度/高度和最小宽度/高度

    在网页制作中经常要控制div宽度最大宽度/高度或者最小宽度/高度,但是在IE6中很多朋友都会遇到不兼容的头疼问题,包括我也经常遇到这样的问题,在百度查了很多都没法解决,后来在一个论坛上学习到,在这里跟 ...

  4. ie10中元素超出父元素的宽度时不能自动隐藏

    (从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期2014-02-21) 今天遇到一个问题,ie10中元素超出父元素的宽度时不能自动隐藏,而其余浏览器却正常显示. 解决方法是,手动给其设 ...

  5. chrome浏览器当表单自动填充时，怎么去除浏览器自动添加的默认样式。

    参考blog来自 http://segmentfault.com/q/1010000000671971 chrome浏览器当表单自动填充时,怎么去除浏览器自动添加的默认样式. 一.发现该问题的原因-是 ...

  6. 关于div宽度和高度的100%设定

    设置DIV大小的有两个属性width和height,以前在学习DIV每次给DIV设置100%宽度或高度时都很迷惑,不明白这个100%的宽度(高度)到底有多宽有多高?这个100%是从哪里得到的从哪里继承 ...

  7. css实现div中图片高度自适应并与父级div宽度一致

    需求:1.父级div不设置高度 2.图片高度自适应,并且显示为正方形: 以前遇到列表中图片高度必须和父级宽度相同,并且需要为正方形的时候,最开始的方法是定死图片高度,这样会导致不同分辨率下图片会压缩, ...

  8. 用原生JS实现的一个导航下拉菜单，下拉菜单的宽度与浏览器视口的宽度一样（js+html+css）

    这个导航下拉菜单需要实现的功能是:下拉菜单的宽度与浏览器视口的宽度一样宽:一级导航只有两项,当鼠标移到一级导航上的导航项时,相应的二级导航出现.在本案例中通过改变二级导航的高度来实现二级导航的显示和消 ...

  9. div 加滚动条 超过div宽度 自动换行 div居中

    一.div 中加滚动条 一. <div style=" overflow:scroll; width:400px; height:400px;”></div> 记住宽 ...

随机推荐

  1. 数据结构之队列（Python 版）

    数据结构之队列(Python 版) 队列的特点:先进先出(FIFO) 使用链表技术实现 使用单链表技术,在表首尾两端分别加入指针,就很容易实现队列类. 使用顺序表list实现 # 队列类的实现 cla ...

  2. CSS3实现文字折纸效果

    CSS3实现文字折纸效果 效果图: 代码如下,复制即可使用: <!DOCTYPE html> <html> <head> <title></tit ...

  3. Codeforces 264B Good Sequences(DP+素数筛)

    题目链接:http://codeforces.com/problemset/problem/264/B 题目大意:给出n个单调递增的数,让你找出最长的好序列,好序列是一种单调递增的并且相邻元素的最大公 ...

  4. SCTP客户端与服务器

    /** * @brief - Send a message, using advanced SCTP features * The sctp_sendmsg() function allows you ...

  5. Asp.net Vnext TagHelpers

    概述 本文已经同步到<Asp.net Vnext 系列教程 >中] TagHelpers 是vnext中引入的新功能之一.TagHelper 的作用是类似于发挥在以前版本的 ASP.NET ...

  6. day6面向对象

    面向对象介绍(http://www.cnblogs.com/alex3714/articles/5188179.htm)     世界万物,皆可分类     世界万物,皆为对象     只要是对象,就 ...

  7. bzoj 1202: [HNOI2005]狡猾的商人

    我居然用暴力跑过去了... 思路:两个区间合成一个新的区间才会产生冲突, 我们用并查集维护前缀和, 0 - n 个节点分别表示sum[ 0 ] - sum[ n ], d[ i ] 表示 前缀i 和它 ...

  8. htm5本地存储方案——websql的封装

    一.websql 简介   在HTML5中,大大丰富了客户端本地可以存储的内容,添加了很多功能来将原本必须保存在服务器上的数据转为保存在客户端本地,从而大大提高了Web应用程序的性能,减轻了服务器端的 ...

  9. htm5本地存储方案——indexdb的封装

    不BB直接上代码 /*封装IndexdDB*/ var localDatabase = { }; localDatabase.dbName = "yiliDB"; localDat ...

  10. python之web框架(3)：WSGI之web应用完善

    python之web框架(3):WSGI之web应用完善 1.上篇的web框架太low,只能实现回应固定页面.现在将它进行完善.首先将wsgi和web服务器进行分离,并给予它回复静态页面的能力. we ...