Creating a Blogger Template (3)

... a fluid design ... This is the third part of the Creating A Blogger Template series: Creating a Blogger Template (1) - from scratch Creating a Blogger Template (2) - the layout Creating a Blogger Template (3) - a fluid design Creating a Blogger Template (4) - variables "Yeah, right, of course ..." (you tell me) "That's all really nice and all ... but where is my flexible layout? I want it fluid ... fluid ... fluid ... ." Let's use that last Main - Column - Column page: [ click image to view page ] The following layout styling was implemented: ( see Creating a Blogger Template (2) ) body {      margin: 0px;      padding: 0px;      } #container {      width: 960px;      margin: 10px auto;      padding: 0 10px;      } #header {      padding: 10px;      } #main {      width: 560px;      float: left;      } #sidebar1, #sidebar2 {      width: 190px;      float: left;      margin-left: 10px;      } #footer {      padding: 10px;      clear: both;      } To change this fixed layout into a flexible one (all columns fluid) only 3 attributes have to be altered: body {      margin: 0px;      padding: 0px;      } #container {      width: 96%;      margin: 10px auto;      padding: 0 10px;      } #header {      padding: 10px;      } #main {      width: 48%;      float: left;      } #sidebar1, #sidebar2 {      width: 24%;      float: left;      margin-left: 10px;      } #footer {      padding: 10px;      clear: both;      } Thus: Main - Column - Column all flexible page !!! [ click image to view page ] Again this is merely to show how it's done. Once the structure is created the fun part begins ... . Remember: all examples in the last 3 posts are (apart from the layout CSS as added in CaBT 2 & 3) still not styled at all. Everything is pure Browser Default!