DenInnorelarfWar
New Member
I'm trying to implement two column layout page by body width 100% and one column width as 30% and other as 70%. But the second column [width: 70%] is not working.HTML:\[code\]<!DOCTYPE HTML><html lang="en-US"><head> <meta charset="UTF-8"> <title></title></head><body> <div class="offer-details">aaaaaaaaaaaaaaaaaaaaaaaaa</div> <div class="offer-map">bbbbbbbbbbbbbbbbbbbbbbbbbbbb</div></body></html>?\[/code\]CSS\[code\]html { height: 100%;}body { background-color: #F3F3F3; width: 100%; height: 100%; font-family: 'Helvetica Neue', helvetica, Arial, sans-serif; overflow: hidden;}* { margin: 0; padding: 0;}.offer-details { float: left; width: 30%; height: 100%; background-color: inherit; text-align: justify; overflow: auto;}.offer-map { float: left; width: 70%; height: 100%; background-position: center center; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; -webkit-transition: opacity 1s cubic-bezier(0.770, 0.000, 0.175, 1.000); border-left: 5px solid #E1E1E1; overflow: auto; background-color: white;}?\[/code\]jQuery\[code\]$(function () { var width = $(document).width()+"px"; var height = $(document).height()+"px"; $('body').css({'width': width, 'height': height}); })?\[/code\]Here is the http://jsfiddle.net/yBNEr/2/Thanks!