登录 | 注册 | FAQ
Anonymous

Auto Resize div

+ 发表回复

3 篇帖子 分页: 1 / 1


Auto Resize div

joe1211 » 周日 6月 15, 2014 1:40 am

What is the best way to auto resize the div element when screen size changes (responsive design) !
头像

joe1211

  • 帖子: 3
  • 注册: 周六 6月 14, 2014 10:55 pm

Re: Auto Resize div

merlin » 周日 6月 15, 2014 9:53 pm

You could try this.


<!DOCTYPE html>

<html lang="en">
<head>
<meta charset="utf-8">
<title> </title>
<link rel="stylesheet" href=".css">
<script src=".js"> </script>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"> </script>
<![endif]-->
<head>

<style>

h1
{
text-align:center;
margin-bottom:30px;
}

body
{
background:#ffdab9;
}

main
{

border:5px solid blue;
height:500px;

display: -webkit-flex;
display: flex;

-webkit-justify-content:center;
justify-content:center;

-webkit-align-items:center;
align-items:center;

-webkit-flex:1 1 auto;
flex:1 1 auto;
}

main div
{
min-width:90%;
border:5px solid red;
text-align:center;
font-size:2em;
}

</style>

</head>

<body>

<h1>FLEXIBLE DIV</h1>

<main>

<div >
<p> TEST</p>
</div>

</main>

</body>
</html>
头像

merlin

  • 帖子: 44
  • 注册: 周日 12月 19, 2010 3:31 pm

Re: Auto Resize div

nanoverso » 周一 6月 16, 2014 1:35 am

There are excellent open source frameworks out there who help manage the aspects of responsive design features, like Bootstrap from Twitter team and Foundation by Zurb.
头像

nanoverso

  • 帖子: 253
  • 注册: 周六 5月 10, 2014 12:08 am
  • 地址: Brazil
--
Free VST Plugins Download.


+ 发表回复

分页: 1 / 1