Jump to content

javascript hiding behind div

sigmund

By sigmund
in CSS

Recommended Posts

sigmund Newbie

sigmund

Posted
  • Author
Posted

ok - sorry I resisted - :) it's kinda long and I was hoping it might be a generic common problem. Here goes:here's the html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"                      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en'>    <head>        <title>Multi-column Layout</title>		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">        <link href="template_post.css" rel="stylesheet" type="text/css" /></head><body><div id='main_container'>	  <div id='header_container'>     <div id='header_left'><img src="images/logo_1.gif" /><img  class='head_img2' src="images/header_identifier.gif" /></div>    <div id='header_right'>       <div id="ToshGlobal" align="center"> <a href="http://www.yahoo.com" class="ToshGlobal" title="title here" target="_blank">a hyperlink will go here</a><a href="http://www.yahoo.com" class="ToshGlobal" title="Title here" target="_blank">a hyperlink will go here</a> </div>    </div>  </div>  <!-- end header_container -->	   <div class="navBack">     <!-- DO NOT MOVE! The following code must always be placed right AFTER the BODY tag-->    <!-- ******** BEGIN CODE FOR glob_right ******** -->    <span id='xawmMenuPathImg-glob_right'><img name='awmMenuPathImg-glob_right' id='awmMenuPathImg-glob_right' src='common/nav_global_right/awmmenupath.gif' alt=''></span>     <script type='text/javascript'>var MenuLinkedBy='AllWebMenus [2]', awmBN='DW'; awmAltUrl='';</script>    <script src='common/nav_global_right/glob_right.js' language='JavaScript1.2' type='text/javascript'></script>    <script type='text/javascript'>awmBuildMenu();</script>    <!-- ******** END CODE FOR glob_right ******** -->    <!-- ******** BEGIN CODE FOR global_left ******** -->    <span id='xawmMenuPathImg-global_left'><img name='awmMenuPathImg-global_left' id='awmMenuPathImg-global_left' src='common/nav_global_left/awmmenupath.gif' alt=''></span>     <script type='text/javascript'>var MenuLinkedBy='AllWebMenus [2]', awmBN='DW'; awmAltUrl='';</script>    <script src='common/nav_global_left/global_left.js' language='JavaScript1.2' type='text/javascript'></script>    <script type='text/javascript'>awmBuildMenu();</script>    <!-- ******** END CODE FOR global_left ******** -->    <span id='awmAnchor-global_left' class='awmAnchorLeft'></span> <span id='awmAnchor-glob_right' class='awmAnchorRight'></span>   </div>  <!-- end nav back -->		<div class='backBreadcrumb'><a href="http://www.yahoo.com" class="bcLink1">Industrial Systems</a> <img src="images/arrow_bcrumb.png" width="9" height="9"></div>				     <div id='sub_container'>     <div id='left'> Left side column.<br>next line </div>    <div id='content'>       <h4>Lorem Ipsum</h4>      <p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec eu massa.         Phasellus est eros, malesuada vel, tempus quis, pharetra at, lacus. Ut         sit amet libero. Aliquam erat volutpat. Morbi erat. Nunc et purus vitae         tortor sodales auctor. Nulla molestie. Pellentesque ante mauris, tristique         ac, placerat sit amet, placerat nec, ante. Vestibulum interdum. Donec         vitae tellus. Aliquam erat volutpat. Aenean dictum dolor ut sem. </p>      <p> Ut commodo. Sed non nisi at leo aliquet lobortis. Donec a elit vel nulla         pharetra dignissim. Lorem ipsum dolor sit amet, consectetuer adipiscing         elit. Aliquam cursus tortor eget diam. Pellentesque pellentesque turpis         sed erat. Duis non libero vel metus sollicitudin aliquet. Aenean neque.         Nunc eget quam a mauris vulputate laoreet. Mauris dictum, eros venenatis         fringilla vehicula, tortor augue dignissim ante, id imperdiet risus sapien         at odio. Praesent ligula magna, nonummy vitae, facilisis at, fermentum         non, diam. Integer sit amet ligula quis lectus bibendum porta. Aliquam         neque ipsum, aliquet et, semper vel, blandit ac, massa. Etiam porttitor         justo id arcu. Ut ante lacus, rutrum id, vehicula non, faucibus in, lorem.         Integer eu ante ut mauris rhoncus molestie. Aenean ut est et lectus tempor         pharetra. Fusce sed nibh. Class aptent taciti sociosqu ad litora torquent         per conubia nostra, per inceptos hymenaeos. </p>    </div>  </div>  <!-- end sub_container -->  <div id='footer'>            <p>                Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec eu                massa. Phasellus est eros, malesuada vel, tempus quis, pharetra at,                lacus.            </p>        </div>		</div><!-- end main_container -->		 </body></html>

here's the .css

/* CSS Document */body {	margin:0;	padding:0;	/*border: 2px solid black;*/	height: 90%;/*doesnt work in ie7 or firefox but works in IE 6*/}div#main_container{	/*border: 2px solid black;*/	height:90%;/*doesnt work in firefox or ie 6*/}div#header_container {	position: relative;	width: auto;    height: 68px;	/*border: 1px solid rgb(200, 200, 200);*/    margin: auto;}div#header_left {	width: 400px;    height: 68px;    /*border: 1px solid rgb(200, 200, 200);*/	top:0;	left:0;	position: absolute;}img.head_img2{	margin: 0 auto 0 30px;}div#header_right {	width: 400px;    height: 68px;    /*border: 1px solid rgb(200, 200, 200);*/	top:0;	right:0;	position: absolute;}div#ToshGlobal {	/*border: 2px solid green;*/	width: 300px;	height: 50px;	right:0;	padding-top: 15px;	position: absolute;}a.ToshGlobal:link, a.ToshGlobal:visited, a.ToshGlobal:active, a.ToshGlobal:hover {	font-family: Arial, Helvetica, sans-serif;	font-size: 11px;	font-weight: bold;	color: #666666;	text-decoration:none;	text-transform: uppercase;	background-image: url(images/tosh_arrow_off.png);	background-repeat: no-repeat;	background-position: 1% 50%;	text-indent: 3px;	height: 40px;	width: 145px;	padding-left: 18px;	padding-top: 2px;	margin:10px;	/*border:1px solid purple;*/}a.ToshGlobal:hover {	font-family: Arial, Helvetica, sans-serif;	font-size: 11px;	font-weight: bold;	color: #19A4B4;	text-decoration:none;	background-image: url(images/tosh_arrow_on.png);	background-position: 1% 50%;	text-indent: 3px;	height: 40px;	width: 145px;	padding-left: 18px;	padding-top: 2x;	margin:10px;	/*border:1px solid purple;*/}div.navBack{	height: 21px;	background-image: url(images/back_nav_global21.png);	background-repeat: repeat;	position:relative;	border:1px solid grey;	margin: 3px 3px 0 3px;}.awmAnchorLeft {position:absolute;left:0px;top:0px;}.awmAnchorRight {position:absolute;right:330px;top:0px;}div.backBreadcrumb {	background-image: url(images/back_bcrumb.png);	background-repeat: repeat;	border:1px solid grey;	margin: 0 3px;}a.bcLink1:link, a.bcLink1:visited, a.bcLink1:active, a.bcLink1:hover {	font-family: Arial, Helvetica, sans-serif;	font-size: 18px;	font-style: normal;	font-weight: bold;	font-variant: normal;	color: #1E7C90;	text-align: left;	text-decoration:none;}a.bcLink2:link, a.bcLink2:visited, a.bcLink2:active, a.bcLink2:hover {	font-family: Arial, Helvetica, sans-serif;	font-size: 16px;	font-style: normal;	font-weight: bold;	font-variant: normal;	color: #1E7C90;	text-align: left;	text-decoration:none;}a.bcLink3:link, a.bcLink3:visited, a.bcLink3:active, a.bcLink3:hover {	font-family: Arial, Helvetica, sans-serif;	font-size: 14px;	font-style: normal;	font-weight: bold;	font-variant: normal;	color: #1E7C90;	text-align: left;	text-decoration:none;}a.bcLink4:link, a.bcLink4:visited, a.bcLink4:active, a.bcLink4:hover {	font-family: Arial, Helvetica, sans-serif;	font-size: 12px;	font-style: normal;	font-weight: bold;	font-variant: normal;	color: #1E7C90;	text-align: left;	text-decoration:none;}a.bcLink5:link, a.bcLink5:visited, a.bcLink5:active, a.bcLink5:hover {	font-family: Arial, Helvetica, sans-serif;	font-size: 11px;	font-style: normal;	font-weight: bold;	font-variant: normal;	color: #1E7C90;	text-align: left;	text-decoration:none;}div#sub_container {	border: 1px solid black;   /* max-width: 1000px;    min-width: 600px;*/    background: rgb(244, 244, 244);	/*background: litegrey;*/	position: relative;    margin: 3px 3px 0 3px;	/*height:100%;*/}div#left {    position: absolute;    top: 0;    bottom: 0;    left: 0;    width: 200px;    background: rgb(234, 234, 234);    padding: 5px;    border: 1px solid black;	/*height:100%;*/}div#content {    margin-left: 211px;    background: white;    /*border: 1px solid white;*/    padding: 10px;}div#footer {	border: 1px solid black;   /* max-width: 1000px;    min-width: 600px;*/    background: rgb(244, 244, 244);    margin: -1px 3px 3px 3px;}div#footer p {    margin: 5px;}

thanks

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...