Current location: Hot Scripts Forums » General Web Coding » CSS » Content of a div affecting links in other divs?


Content of a div affecting links in other divs?

Reply
 
LinkBack Thread Tools Display Modes
  #1 (permalink)  
Old 03-26-10, 01:00 PM
sdd sdd is offline
Newbie Coder
  
Join Date: Mar 2010
Posts: 5
Thanks: 0
Thanked 0 Times in 0 Posts
Question Content of a div affecting links in other divs?
I'm guessing its probably just some little thing but I have looked at it so many times I can't find the problem. What is happening is that if there is any content at all in the "textlinks_wide" div, then no links in any of the divs under the "page_full" div will work in any browser other than IE. They just cease to be links at all. I've used this format in several other sites with no problem so I am puzzled why there is one now. And why the content of one div is affecting others like that. And it only affects the links nested under "page_full" - the nav links work as well as the header. Any insight would be greatly appreciated! Thank you!

HTML Code:
<!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"> 
<html>
<head>
	<style>
	body {
	background: #000000 url(../images/bg.jpg) repeat top left;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	color: #000000;
	font-size: 14px;
	padding: 0px;
	margin: 0px;
	}
a {
	color:#a00211;
	text-decoration: none;
	}	
a:visited {
	color:#a00211;
	text-decoration: none;
	}	
a:hover {
	color:#fea201;
	text-decoration:none;
	}	
a:active {
	color:#a00211;
	text-decoration: none;
	}	
.regularText {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #000000;
	}
.disclaimerText {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size:11px;
	}
.highlightText {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	color: #d31108;
	}
.disclaimerText {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size:11px;
	}
h1 {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 22px;
	font-weight: bold;
	}
h2 {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: bold;
	}
hr {
	color:#71000b;
	background: #71000b;
	background-color: #71000b;
	width: 90%;
	text-align: center; 
	border: 0;
	height: 1px;
	margin:0px;
	padding:0;
}

/* ************************************ Custom CSS *************************************** */
.thumbBorders{
   border: #71000b 1px solid;
	margin-bottom: 10px;
	}	
.picBorders{
   border: #71000b 2px solid;
	margin: 19px;
	padding: 0px;
	}	
table.rates {
	margin-left: auto;
	margin-right: auto;
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 12px;
	color: #000000;
	width: 650px;
	background-color: #ffffff;
	border: 2px solid #972727;
	border-collapse: collapse;
	border-spacing: 0px;
	padding-left: 10px;
	padding-right: 10px;
	}
tr.rates {
	background-color: #cb9393;
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #0000;
	}
hr.bottom{
	color:#71000b;
	background: #71000b;
	width: 100%;
	text-align: center; 
	border: 0;
	height: 1px;
	margin:5px auto;
	padding:0;
	}

/* ************************************ Standard Page Build *************************************** */
#header {
	position:relative;
	background: url(../images/header.jpg);
	height:207px;
	width:952px;
	margin:auto;
	margin-top:15px;
	border: 4px solid #71000b;
	}
#nav {
	position:relative;
	max-height:30px;
	max-width:954px;
	margin:auto;
	margin-top:15px;
	border: 3px solid #71000b;
	}
#midpage {
	position:relative;
	margin-top: 15px;
	}
#midpage_inner {
	max-width: 960px;
	margin:auto;
	}
#main {
	position:relative;
	width:960px;
	max-width:960px;
	margin:auto;
	padding:0px;
	}
#pic_left {
	position:relative;
	background: url(../images/pic_frame.jpg);
	border: 4px solid #71000b;
	text-align:center;
	max-width:296px;
	padding:0px;
	margin:0px;
	float:left;
	}
#page_right {
	position:relative;
	width:633px;
	float:left;
	height: 100%;
	border: 4px solid #71000b;
	margin-left: 15px;
	}
#title {
	position:relative;
	height:47px;
	width:633px;
	}
#content {
	position:relative;
	background:#faf4e5 url(../images/content_bg.jpg) repeat-y;
	width:633px;
	text-align: center;
	min-height:313px;
	}
#content-inner {
	border: 2px solid #71000b;
	background:#faf4e5;
	min-height: 303px;
	max-width: 591px;
	margin: 0px 23px 0px 23px;
	padding: 5px;
	text-align: left;
}
#frame_bottom {
	position:relative;
	background: url(../images/content_bottom.jpg);
	height:17px;
	width:633px;
	}
.clr {
	clear:both;
	}
#footer {
	position:relative;
	width: 960px;
	margin:auto;
	padding:0px;	
	}
#textlinks {
	position:relative;
	width:633px;
	text-align:center;
	font-size:13px;
	color:#ec6703;
	margin-left:320px;
	margin-bottom:5px;
	margin-top:10px;
	}
#textlinks a {
	color:#c30316;
	text-decoration: none;
	}
#textlinks a:hover {
	color:#fdad02;
	text-decoration: none;
	}
#bottom {
	position:relative;
	width:633px;
	margin-left:320px;
	margin-top:5px;
	margin-bottom:20px;
	}
#copyright {
	text-align:left;
	font-size:10px;
	padding-left:3px;
	color:#ddb663;
	float:left;
	margin-bottom:5px;
	}
#sdd {
	text-align:left;
	font-size:10px;
	padding-right:3px;
	color:#ddb663;
	float:right;
	margin-bottom:5px;
	}
#sdd a {
	color:#8d0310;
	text-decoration: none;
	}
#sdd a:hover {
	color:#fdad03;
	text-decoration: none;
	}
	

/* ************************************ Wide Page Build *************************************** */

#page_full {
	position:relative;
	width:952px;
	float:left;
	height: 100%;
	border: 4px solid #71000b;
	}
#title_wide {
	position:relative;
	height:47px;
	width:952px;
	}
#content_wide {
	position:relative;
	background:#faf4e5 url(../images/content_bg_wide.jpg) repeat-y;
	width:952px;
	text-align: center;
	min-height:313px;
	}
#content-inner_wide {
	border: 2px solid #71000b;
	background:#faf4e5;
	min-height: 313px;
	max-width: 910px;
	margin: 0px 23px 0px 23px;
}
#frame_bottom_wide {
	position:relative;
	background: url(../images/content_bottom_wide.jpg);
	height:17px;
	width:952px;
	}
#textlinks_wide {
	position:relative;
	width:952px;
	text-align:center;
	font-size:13px;
	color:#ec6703;
	margin-bottom:5px;
	margin-top:10px;
	}
#textlinks_wide a {
	color:#c30316;
	text-decoration: none;
	}
#textlinks_wide a:hover {
	color:#fdad02;
	text-decoration: none;
	}
#bottom_wide {
	position:relative;
	width:952px;
	margin-top:5px;
	margin-bottom:20px;
	}
	
/* ************************************ Index Page Build *************************************** */
#index_main {
	position:relative;
	height:532px;
	width:952px;
	margin:auto;
	margin-top:15px;
	border: 4px solid #71000b;
	}	
#index_row1 {
	position:relative;
	width:952px;
	margin: auto;
	min-height:237px;
	}
#index_01 {
	position:relative;
	height:237px;
	width:394px;
	background: url(../images/index_01.jpg);
	text-align: left;
	}
#index_02 {
	position:absolute;
	height:237px;
	top: 0px;
	left: 394px;
	background: url(../images/index_02.jpg);
	text-align: right;
	}	
#index_row2 {
	position:relative;
	width:952px;
	margin: auto;
	min-height:240px;
	}
#index_03 {
	position:relative;
	height:240px;
	width:394px;
	background: url(../images/index_03.jpg);
	}
#index_04 {
	position:absolute;
	height:240px;
	top: 0px;
	left: 394px;
	background: url(../images/index_04.jpg);
	}	
#index_row3 {
	position:relative;
	width:952px;
	margin: auto;
	min-height:55px;
	}
#index_05 {
	position:relative;
	height:55px;
	width:394px;
	background: url(../images/index_05.jpg);
	}
#index_enter {
	position:absolute;
	height:55px;
	top: 0px;
	left: 394px;
	background: url(../images/enter.jpg);
	}
#index_exit {
	position:absolute;
	height:55px;
	top: 0px;
	left: 589px;
	background: url(../images/exit.jpg);
	}
#index_06 {
	position:absolute;
	height:55px;
	top: 0px;
	left: 742px;
	background: url(../images/index_06.jpg);
	}	
#disclaimer {
	position:relative;
	width: 650px;
	height:300px;
	display: none;
	top: -400px;
	left: 25%;
	text-align: left;
	}

/* ************************************ Form CSS *************************************** */
	
.form {
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
	margin: 0px 0px 0px 0px;
	}
.formfield {
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
	font-size: 12px;
	background-color: #faf4e5;
	color: #000000;
	}
.formAsterisk {
		font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
		font-size: 11px;
		color: #b60313;	
	}

input.color {
	background-color: #faf4e5;
	font-weight: normal;
	font-size: 11px;
	color: #000000;
	}
textarea.color {
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: black;
	background-color: #F3F3F3;
	border: 1px solid #193878;
	width: 450px;
	}
input.submit {
	border: 1px double #000000;
	background-color: #F3F3F3;
	color: #000000;
	font-size: 9px;
	text-align: center;
	font-family: Verdana, Helvetica, Arial, sans-serif;
	}
input.submit:hover {
	border: 1px double #000000;
	font-weight: bold;
	background-color: #F3F3F3;
	color: #000000;
	font-size: 9px;
	text-align: center;
	font-family: Verdana, Helvetica, Arial, sans-serif;
	}
.checkbox{
	display: inline;
	padding: 0px;
	background-color: #ffffff;
	border: 1px solid #b5224c;
	}

/* ************************************ Calendar CSS *************************************** */
#calendar table {
	width: 569px;
	background-color: #e8d4a5;
	}
#calendar td {
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #000000;
	max-width: 15%;
	}
#calendar td.days {
	background-color: #e8d4a5;
	max-width: 15%;
	}
#cal_heading table {
	width: 569px;
	background-color: #e8d4a5;
	}
A.checkAvail {
	color : #a2854e;
	text-decoration: none;
	font-size : 10px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}
A:HOVER.checkAvail {
	color : #fea201;
	text-decoration: none;
	font-size : 10px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}
A.checkAvailTravel {
	color : #a00211;
	text-decoration: none;
	font-size : 10px;
	font-weight: bold;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}
A:HOVER.checkAvailTravel {
	color : #fea201;
	text-decoration: none;
	font-size : 10px;
	font-weight: bold;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}
.month {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #000000;
	padding-bottom: 3px;
	padding-top: 1px;
	font-weight : bold;
	font-style: italic;
}
.next_prev {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	padding-bottom: 3px;
	padding-top: 1px;
}
.today {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #dda91a;
	padding-bottom: 3px;
	padding-top: 1px;
	font-weight : bold;
	font-style: italic;
}
.days {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #000000;
	font-style: italic;
	padding-bottom: 3px;
	padding-top: 3px;
}

.calAvail {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #faf4e5;
	font-weight: normal;
}
.calUnavail {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #faf4e5;
	font-weight: normal;
}
.number {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	padding-right: 4px;
	padding-top: 3px;
}

	</style>
</head>

<body>

<div id="header"></div>
<div id="nav"></div>
<div id="midpage"> 
	<div id="midpage_inner">
        <div id="main">
			<div id="page_full">
				<div id="title_wide"></div>
				<div id="content_wide">
					<div id="content-inner_wide">
					Content goes here
					</div>
				</div>
				<div id="frame_bottom_wide"></div>
			</div>
		</div>
	</div>
</div>
<div id="footer">
	<div id="textlinks_wide">
	test
	</div>
	<div id="bottom_wide">
		<div id="copyright">
		&copy;2010
		</div>
		<div id="sdd">
		Designed by <a href="" target="_blank">SDD</a>
		</div>
	</div>
</div>

</body>
</html>
Last edited by wirehopper; 03-26-10 at 02:52 PM. Reason: Added HTML tags
Reply With Quote
  #2 (permalink)  
Old 03-26-10, 02:00 PM
DaiLaughing DaiLaughing is offline
Newbie Coder
  
Join Date: Jul 2009
Posts: 37
Thanks: 0
Thanked 0 Times in 0 Posts
Please use CODE tags (see the icons just above the posting text area).

You have 7 errors of validation including some basics so I'd fix those first.

validator.w3.org/
Reply With Quote
  #3 (permalink)  
Old 03-26-10, 02:54 PM
wirehopper's Avatar
wirehopper wirehopper is offline
-
  
Join Date: Feb 2006
Posts: 2,515
Thanks: 20
Thanked 109 Times in 106 Posts
You also might want to take the CSS out of the HTML. Better performance, easier to read code.

As DaiL said - validate.

Reply With Quote
  #4 (permalink)  
Old 03-27-10, 12:58 AM
sdd sdd is offline
Newbie Coder
  
Join Date: Mar 2010
Posts: 5
Thanks: 0
Thanked 0 Times in 0 Posts
Okay, I did the validation. Thank you for that. And on the second comment, the CSS is actually in a separate file - not in the HTML, as well as the footer, nav and other reused elements. I put it all together for this for this post so that everything could be see, including the CSS, assuming that could be where my error is. I have just recently started building sites with CSS rather than with tables, so I am still learning, hence the plea for help from those more experienced.

Here is the updated, validated code. The original problem still exists. Any help would be greatly appreciated. :-) Thank you in advance!

Code:
<!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" xml:lang="en" lang="en">
<head>
	<title>Gallery</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<style type="text/css">
	body {
		background: #000000 url(../images/bg.jpg) repeat top left;
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		color: #000000;
		font-size: 14px;
		padding: 0px;
		margin: 0px;
		}
	a {
		color:#a00211;
		text-decoration: none;
		}	
	a:visited {
		color:#a00211;
		text-decoration: none;
		}	
	a:hover {
		color:#fea201;
		text-decoration:none;
		}	
	a:active {
		color:#a00211;
		text-decoration: none;
		}	
	.regularText {
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		font-weight: normal;
		color: #000000;
		}
	.disclaimerText {
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		font-weight: normal;
		font-size:11px;
		}
	.highlightText {
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		color: #d31108;
		}
	.disclaimerText {
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		font-weight: normal;
		font-size:11px;
		}
	h1 {
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		font-size: 22px;
		font-weight: bold;
		}
	h2 {
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		font-size: 18px;
		font-weight: bold;
		}
	hr {
		color:#71000b;
		background: #71000b;
		background-color: #71000b;
		width: 90%;
		text-align: center; 
		border: 0;
		height: 1px;
		margin:0px;
		padding:0;
	}
	
	/* ************************************ Custom CSS *************************************** */
	.thumbBorders{
	   border: #71000b 1px solid;
		margin-bottom: 10px;
		}	
	.picBorders{
	   border: #71000b 2px solid;
		margin: 19px;
		padding: 0px;
		}	
	table.rates {
		margin-left: auto;
		margin-right: auto;
		font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
		font-weight: normal;
		font-size: 12px;
		color: #000000;
		width: 650px;
		background-color: #ffffff;
		border: 2px solid #972727;
		border-collapse: collapse;
		border-spacing: 0px;
		padding-left: 10px;
		padding-right: 10px;
		}
	tr.rates {
		background-color: #cb9393;
		font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
		font-weight: normal;
		color: #0000;
		}
	hr.bottom{
		color:#71000b;
		background: #71000b;
		width: 100%;
		text-align: center; 
		border: 0;
		height: 1px;
		margin:5px auto;
		padding:0;
		}
	
	/* ************************************ Standard Page Build *************************************** */
	#header {
		position:relative;
		background: url(../images/header.jpg);
		height:207px;
		width:952px;
		margin:auto;
		margin-top:15px;
		border: 4px solid #71000b;
		}
	#nav {
		position:relative;
		max-height:30px;
		max-width:954px;
		margin:auto;
		margin-top:15px;
		border: 3px solid #71000b;
		}
	#midpage {
		position:relative;
		margin-top: 15px;
		}
	#midpage_inner {
		max-width: 960px;
		margin:auto;
		}
	#main {
		position:relative;
		width:960px;
		max-width:960px;
		margin:auto;
		padding:0px;
		}
	#pic_left {
		position:relative;
		background: url(../images/pic_frame.jpg);
		border: 4px solid #71000b;
		text-align:center;
		max-width:296px;
		padding:0px;
		margin:0px;
		float:left;
		}
	#page_right {
		position:relative;
		width:633px;
		float:left;
		height: 100%;
		border: 4px solid #71000b;
		margin-left: 15px;
		}
	#title {
		position:relative;
		height:47px;
		width:633px;
		}
	#content {
		position:relative;
		background:#faf4e5 url(../images/content_bg.jpg) repeat-y;
		width:633px;
		text-align: center;
		min-height:313px;
		}
	#content-inner {
		border: 2px solid #71000b;
		background:#faf4e5;
		min-height: 303px;
		max-width: 591px;
		margin: 0px 23px 0px 23px;
		padding: 5px;
		text-align: left;
	}
	#frame_bottom {
		position:relative;
		background: url(../images/content_bottom.jpg);
		height:17px;
		width:633px;
		}
	.clr {
		clear:both;
		}
	#footer {
		position:relative;
		width: 960px;
		margin:auto;
		padding:0px;	
		}
	#textlinks {
		position:relative;
		width:633px;
		text-align:center;
		font-size:13px;
		color:#ec6703;
		margin-left:320px;
		margin-bottom:5px;
		margin-top:10px;
		}
	#textlinks a {
		color:#c30316;
		text-decoration: none;
		}
	#textlinks a:hover {
		color:#fdad02;
		text-decoration: none;
		}
	#bottom {
		position:relative;
		width:633px;
		margin-left:320px;
		margin-top:5px;
		margin-bottom:20px;
		}
	#copyright {
		text-align:left;
		font-size:10px;
		padding-left:3px;
		color:#ddb663;
		float:left;
		margin-bottom:5px;
		}
	#sdd {
		text-align:left;
		font-size:10px;
		padding-right:3px;
		color:#ddb663;
		float:right;
		margin-bottom:5px;
		}
	#sdd a {
		color:#8d0310;
		text-decoration: none;
		}
	#sdd a:hover {
		color:#fdad03;
		text-decoration: none;
		}
		
	
	/* ************************************ Wide Page Build *************************************** */
	
	#page_full {
		position:relative;
		width:952px;
		float:left;
		height: 100%;
		border: 4px solid #71000b;
		}
	#title_wide {
		position:relative;
		height:47px;
		width:952px;
		}
	#content_wide {
		position:relative;
		background:#faf4e5 url(../images/content_bg_wide.jpg) repeat-y;
		width:952px;
		text-align: center;
		min-height:313px;
		}
	#content-inner_wide {
		border: 2px solid #71000b;
		background:#faf4e5;
		min-height: 313px;
		max-width: 910px;
		margin: 0px 23px 0px 23px;
	}
	#frame_bottom_wide {
		position:relative;
		background: url(../images/content_bottom_wide.jpg);
		height:17px;
		width:952px;
		}
	#textlinks_wide {
		position:relative;
		width:952px;
		text-align:center;
		font-size:13px;
		color:#ec6703;
		margin-bottom:5px;
		margin-top:10px;
		}
	#textlinks_wide a {
		color:#c30316;
		text-decoration: none;
		}
	#textlinks_wide a:hover {
		color:#fdad02;
		text-decoration: none;
		}
	#bottom_wide {
		position:relative;
		width:952px;
		margin-top:5px;
		margin-bottom:20px;
		}
		
	/* ************************************ Index Page Build *************************************** */
	#index_main {
		position:relative;
		height:532px;
		width:952px;
		margin:auto;
		margin-top:15px;
		border: 4px solid #71000b;
		}	
	#index_row1 {
		position:relative;
		width:952px;
		margin: auto;
		min-height:237px;
		}
	#index_01 {
		position:relative;
		height:237px;
		width:394px;
		background: url(../images/index_01.jpg);
		text-align: left;
		}
	#index_02 {
		position:absolute;
		height:237px;
		top: 0px;
		left: 394px;
		background: url(../images/index_02.jpg);
		text-align: right;
		}	
	#index_row2 {
		position:relative;
		width:952px;
		margin: auto;
		min-height:240px;
		}
	#index_03 {
		position:relative;
		height:240px;
		width:394px;
		background: url(../images/index_03.jpg);
		}
	#index_04 {
		position:absolute;
		height:240px;
		top: 0px;
		left: 394px;
		background: url(../images/index_04.jpg);
		}	
	#index_row3 {
		position:relative;
		width:952px;
		margin: auto;
		min-height:55px;
		}
	#index_05 {
		position:relative;
		height:55px;
		width:394px;
		background: url(../images/index_05.jpg);
		}
	#index_enter {
		position:absolute;
		height:55px;
		top: 0px;
		left: 394px;
		background: url(../images/enter.jpg);
		}
	#index_exit {
		position:absolute;
		height:55px;
		top: 0px;
		left: 589px;
		background: url(../images/exit.jpg);
		}
	#index_06 {
		position:absolute;
		height:55px;
		top: 0px;
		left: 742px;
		background: url(../images/index_06.jpg);
		}	
	#disclaimer {
		position:relative;
		width: 650px;
		height:300px;
		display: none;
		top: -400px;
		left: 25%;
		text-align: left;
		}
	
	/* ************************************ Form CSS *************************************** */
		
	.form {
		font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
		font-size: 12px;
		color: #000000;
		margin: 0px 0px 0px 0px;
		}
	.formfield {
		font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
		font-size: 12px;
		background-color: #faf4e5;
		color: #000000;
		}
	.formAsterisk {
			font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
			font-size: 11px;
			color: #b60313;	
		}
	
	input.color {
		background-color: #faf4e5;
		font-weight: normal;
		font-size: 11px;
		color: #000000;
		}
	textarea.color {
		font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
		font-size: 11px;
		color: black;
		background-color: #F3F3F3;
		border: 1px solid #193878;
		width: 450px;
		}
	input.submit {
		border: 1px double #000000;
		background-color: #F3F3F3;
		color: #000000;
		font-size: 9px;
		text-align: center;
		font-family: Verdana, Helvetica, Arial, sans-serif;
		}
	input.submit:hover {
		border: 1px double #000000;
		font-weight: bold;
		background-color: #F3F3F3;
		color: #000000;
		font-size: 9px;
		text-align: center;
		font-family: Verdana, Helvetica, Arial, sans-serif;
		}
	.checkbox{
		display: inline;
		padding: 0px;
		background-color: #ffffff;
		border: 1px solid #b5224c;
		}
	
	/* ************************************ Calendar CSS *************************************** */
	#calendar table {
		width: 569px;
		background-color: #e8d4a5;
		}
	#calendar td {
		font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
		font-weight: normal;
		color: #000000;
		max-width: 15%;
		}
	#calendar td.days {
		background-color: #e8d4a5;
		max-width: 15%;
		}
	#cal_heading table {
		width: 569px;
		background-color: #e8d4a5;
		}
	A.checkAvail {
		color : #a2854e;
		text-decoration: none;
		font-size : 10px;
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	}
	A:HOVER.checkAvail {
		color : #fea201;
		text-decoration: none;
		font-size : 10px;
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	}
	A.checkAvailTravel {
		color : #a00211;
		text-decoration: none;
		font-size : 10px;
		font-weight: bold;
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	}
	A:HOVER.checkAvailTravel {
		color : #fea201;
		text-decoration: none;
		font-size : 10px;
		font-weight: bold;
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	}
	.month {
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		font-size: 14px;
		color: #000000;
		padding-bottom: 3px;
		padding-top: 1px;
		font-weight : bold;
		font-style: italic;
	}
	.next_prev {
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		font-size: 11px;
		color: #000000;
		padding-bottom: 3px;
		padding-top: 1px;
	}
	.today {
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		font-size: 14px;
		color: #dda91a;
		padding-bottom: 3px;
		padding-top: 1px;
		font-weight : bold;
		font-style: italic;
	}
	.days {
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		font-size: 10px;
		color: #000000;
		font-style: italic;
		padding-bottom: 3px;
		padding-top: 3px;
	}
	
	.calAvail {
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		font-size: 11px;
		color: #faf4e5;
		font-weight: normal;
	}
	.calUnavail {
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		font-size: 11px;
		color: #faf4e5;
		font-weight: normal;
	}
	.number {
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		font-size: 11px;
		color: #000000;
		padding-right: 4px;
		padding-top: 3px;
	}
</style>
</head>

<body>

<div id="header"></div>
<div id="nav"></div>
<div id="midpage"> 
	<div id="midpage_inner">
        <div id="main">
			<div id="page_full">
				<div id="title_wide"></div>
				<div id="content_wide">
					<div id="content-inner_wide">
					<a href="#">TEST</a>
					</div>
				</div>
				<div id="frame_bottom_wide"></div>
			</div>
		</div>
	</div>
</div>
<div id="footer">
	<div id="textlinks_wide">
	<a href="gallery.php">Gallery</a>&nbsp;&nbsp;
	<br />
	<hr class="bottom" />
	</div>
	<div id="bottom_wide">
		<div id="copyright">
		&copy;2010
		</div>
		<div id="sdd">
		Designed by <a href="" target="_blank">SDD</a>
		</div>
	</div>
</div>

</body>
</html>
Reply With Quote
  #5 (permalink)  
Old 03-27-10, 02:11 AM
DaiLaughing DaiLaughing is offline
Newbie Coder
  
Join Date: Jul 2009
Posts: 37
Thanks: 0
Thanked 0 Times in 0 Posts
If you colour the textlinks_wide DIV with a background colour (yellow?) and the page_full another (green?).

It makes the reason clear. Now all you need is to find the cause!

Judging by the naming of your DIVs you are expecting the footer to be at the bottom but it is actually in the same position as the main content DIVs. Try colouring that one as well and track down what is not where you want it.

Oh and you still have one small error in the tr.rates styling with a colour set with four zero's instead of three or six.
Reply With Quote
  #6 (permalink)  
Old 03-27-10, 02:37 AM
sdd sdd is offline
Newbie Coder
  
Join Date: Mar 2010
Posts: 5
Thanks: 0
Thanked 0 Times in 0 Posts
Thank you!
Wow! That definitely makes it clear. On a whim, I added "<div class="clr"></div>" in after the close of the page_full div and that fixed the problem. Also explained why I didn't have the problem in the version of the page with two middle sections instead of one - that line was already there. Now it works but I don't really understand why. As I mentioned, I'm still getting used to using CSS to build pages (instead of tables) so I still have a lot to learn. I'm going to have to do my homework on this one.

Thank you very much for your help!
Reply With Quote
Reply

Bookmarks

« Onmouse over text or image to change the image | Why use fixed width in CSS? »

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes
Linear Mode Linear Mode

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On
Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
make element follow page scroll ?! how-to k-knudsen JavaScript 12 08-04-09 02:03 PM
Make a div follow page scroll - the continued k-knudsen JavaScript 7 07-25-09 03:38 AM
[SOLVED] Change content in a DIV with links in another DIV s1yfa JavaScript 3 05-04-08 04:10 AM
Error On Registeration timmy408 ASP 2 09-05-04 02:53 PM


All times are GMT -5. The time now is 02:28 PM.
vBulletin® Copyright ©2000 - 2012, Jelsoft Enterprises Ltd.