Welcome to the MacNN Forums.

headbirth · Aug 4, 2005, 09:13 AM

Hi,

I've been puzzling over this for a while. I'm trying to get the copyright info to align right, but also align with the bottom line of the text on the left. It seems to work fine in Safari and even IE (mac) but Firefox drops it down a line so it doesn't align with the bottom copy on the left.

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
	"http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
	<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
		<title>Test</title>
		<script type="text/javascript" src="Content/Scripts/JScriptB.js"></script>
		<meta name="Generator" content="Financial Services Debt Advisory">
		<style type="text/css" media="screen"><!--

		#box {
			width:800px;
			margin: 0px auto;
			padding:0px;
			text-align:left;
		}

		#footer {
			float: left;
			width: 800px;
			height: 28px;
			margin: 50px 0px 0;
			overflow: visible;
			clear: both;
			vertical-align: bottom;
			display: block;
			border-left: 28px solid #7A7F00;
		}
		
		.tgFooter {
			font: 11px/1.5em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif; 
			color: #313A44;
		}
		
		.tgFooterHead { 
			color: #7A7F00;
			font: bold 14px/1em Georgia, Times New Roman, Times, serif; 
			padding-left: 10px;
		}
		--></style>
</head>

<body onload="CSRemoveIEbox();" leftmargin="0" marginheight="0" marginwidth="0" topmargin="0"><div id="box">

<!-- *FOOTER BEGINS --><div id="footer" class="tgFooterHead">

Emerging Growth Financial Services<br>
<span class="tgFooter">
<span style="font-weight: bold;">phone</span> (230) 361-2345 &bull; 
<span style="font-weight: bold;">fax</span> (230) 345-2345
<span style="float: right;">Copyright 2005. All rights reserved.</span></span>

<!-- *FOOTER CLOSE --></div>


</div></body>
</html>

Is this a positioning problem or a Firefox bug. Any work-arounds?

Oh ... another question. Is there anyway to style the br tag with css? I've tried to adjust the amount of space it will break (line-height) with no results. It would be nice to have control of it's leading.

El Gato · Aug 4, 2005, 01:00 PM

move the floated section to the top.

Code:
<span class="tgFooter">
<span style="float: right;">Copyright 2005. All rights reserved.</span>
<span style="font-weight: bold;">phone</span> (230) 361-2345 &bull;
<span style="font-weight: bold;">fax</span> (230) 345-2345
</span>

skalie · Aug 4, 2005, 02:20 PM

Unfortunately I'm of the "bottled out, still using tables" school, but be aware that the !DOCTYPE definition could cause unexpected results. I ended up using....

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

......after getting some advice here from, I think it was from Mr Mundy.

Simon Mundy · Aug 4, 2005, 07:41 PM

Originally Posted by El Gato

move the floated section to the top.

Code:
<span class="tgFooter">
<span style="float: right;">Copyright 2005. All rights reserved.</span>
<span style="font-weight: bold;">phone</span> (230) 361-2345 &bull;
<span style="font-weight: bold;">fax</span> (230) 345-2345
</span>

What he said

headbirth · Aug 5, 2005, 09:19 AM

Thanks guys, moving it to the top worked like a charm.

As far as switching my doc type. Would I have to change my code to xhtml?