Two floats with 45% width and 5% left margin : float and position « Layout « HTML / CSS

Home
HTML / CSS
1.CSS
2.CSS Controls
3.Form
4.IE Firefox
5.Layout
6.Marquee Attributes
7.Meta Tags
8.Microsoft Attributes
9.Object
10.Reference
11.Style Basics
12.Tags
13.Templates
14.XML
HTML / CSS » Layout » float and position 




Two floats with 45% width and 5% left margin
 

<!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>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title></title>
<style type="text/css" media="Screen">
body {
  max-width: 800px;
}

div {
  min-width: 100px;
}
* .ex3 {
  float: left;
  width: 45%;
  margin-left: 5%;
  background: yellow;
}


</style>
</head>
<body>

<div class="ex3"> Float1 </div> 
<div class="ex3"> Float2 </div>
<hr /> 
</body>
</html>

 














Related examples in the same category
1.Relative Float
2.Relative parent and relative child
3.Relative parent and abolute child
4.Sized left float
5.Right-retracted Float
6.Float left shrunk
7.Sized float right
8.Left-retracted Float
9.Float right shrunk
10.Right-extended and Top-extended Float
11.Float-left clear-left shrunk
12.Float-right clear-right shrunk
13.Two floats with 50% width and no margins, borders, or padding
14.Two floats with 50% width and 1px border
15.Two floats with 49.5% width and 5px left margin
16.Two Floating Sections: 25% of container's width, 55% of container's width minus left margin, left border, left border, and left padding
17.Float Divider with clear both
18.Opposing Floats
19.Two childred Floating left
20.Floating Positioning
21.Floating around table
22.float highlighted dimensions with multiple paragraphs
23.float with default margin padding
24.float multiple blocks
25.float left and right
java2s.com  | Contact Us | Privacy Policy
Copyright 2009 - 12 Demo Source and Support. All rights reserved.
All other trademarks are property of their respective owners.