/*---------------------------------------------------------------------- * BASIC WIZARD SCREEN TEMPLATE * BROWSER: IE5.0, IE5.5, IE6.0 * * Usage: This is the catch all template to be used by all TaxCut * Wizard Interview screens. It can be used with any of the screen * types that requires an image to be displayed within the * left column. This is achieved by using any of the image * type CSS files to override the div#leftcontent element * block. * * Hack: This template uses the box model fixed layout hack for * IE5.0 and up browsers. This template requires the browser * to be placed in quirks mode for CSS rendering, such that * this template does not adhere to strict CSS validation. * Triggering quirks mode requires that a comment be * placed before the tag. Basically the hack works * by targeting the tag to make it smaller than the * viewport. This allows the fixed
's to be placed * within the padding or margins of the documents body. */ /*-- Body tag targeted for fixed box layout hack */ body { margin: 0; color: #000; background: #ffffff; overflow: hidden; padding-top: 50px; padding-right: 165px; padding-bottom: 40px; padding-left: 0px; font-family: Arial; font-size: 12px; font-weight: normal; font-style: normal; } /*-- Interview screen content goes in this display block */ div#content { width: 100%; height: 100%; overflow-y: auto; overflow-x: auto; margin-top: 0px; margin-right: 15px; margin-bottom: 0px; margin-left: 127px; padding-top: 10px; padding-right: 15px; padding-bottom: 0px; padding-left: 0px; z-index: 2; } /*-- Interview screen title goes in this display block */ div#title { position: absolute; top: 0px; left: 0px; right: 0px; overflow: hidden; white-space: nowrap; z-index: 1; padding-left: 10px; padding-right: 0px; padding-top: 10px; width: 100%; height: 50px; color: #000; background: #ffffff; } /*-- Interview screen images for distinguishing screen types goes in this display block */ div#leftcolumn { position: absolute; overflow: auto; top: 0px; left: 0px; bottom: 0px; width: 126px; color: #000; background: #ffffff; overflow: hidden; height: 100%; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding: 10px 0px 0px 0px; } /*-- This is the old button rack in CSS. It is just a container that holds float boxes */ div#navigation { overflow: auto; width: 100%; height: 35px; position: absolute; bottom: 0; left: 0px; margin-left: 0px; padding-left: 27px; padding-right: 20px; color: #000; } div#taskbtns { width: 60%; height:30px; } /*-- Each button that is to be displayed to the right is contained in a
right floating box */ div.navright { float: right; padding-right: 10px; } /*-- Each button that is to be displayed to the left is contained in a
left floating box */ div.navleft { float: left; padding-right: 10px; } div.navcenter { } /*-- Only use absolute positioning for screen display not printing. */ @media screen { body>div#title, body>div#leftcolumn, body>div#rightcolumn, body>div#navigation { position: fixed; } } @media print { body>div#title, body>div#leftcolumn, body>div#rightcolumn, body>div#navigation { position: fixed; } }