Also,
If you are gonna float it, be sure to clear the float afterwards. There is
some cross-browswer wierdness with this stuff (from my experience). After
the float it is helpful to put something that must be cleared:
<div style="clear:both">
<br clear="all" style="clear: both ;" />
</div>
This forces the headerWrapper to actually re-calculate the vertical size
based on the floats within it... This is probably NOT the best approach, but
one that has worked for me.
-b
.......................
Ben Nadel
Web Developer
Nylon Technology
350 7th Avenue
Floor 10
New York, NY 10001
212.691.1134 x 14
212.691.3477 fax
www.nylontechnology.com
"Some people call me the space cowboy. Some people call me the gangster of
love."
-----Original Message-----
From: Sandra Clark [mailto:[EMAIL PROTECTED]
Sent: Wednesday, August 16, 2006 11:23 AM
To: CF-Talk
Subject: RE: CSS help
#headerWrapper {
float: right; // Change this!
margin-bottom: 25px;
}
#header {
width: 400px;
text-align: left;
padding-bottom: 5px;
border-bottom: 1px dotted #cccccc;
}
Float the wrapper to the right. Text-align only works on the inline text
within the div, not on the div itself.
Sandra Clark
==============================
http://www.shayna.com
Training in Cascading Style Sheets and Accessibility
CSS HANDS ON
New York City, October 10-13, 2006.
http://www.shayna.com/index.cfm?fuseaction=training.syllabus_display&id=1
Read an interview regarding my CSS Hands on Class at
http://www.shayna.com/index.cfm?fuseaction=blog.display_entry&id=140
-----Original Message-----
From: Rick Root [mailto:[EMAIL PROTECTED]
Sent: Wednesday, August 16, 2006 11:03 AM
To: CF-Talk
Subject: CSS help
I'm having some trouble with CSS.
I'd like to right align a 400px box to the right side of my page, and I want
to LEFT align the text in the page. I've got it working in IE, but not
Firefox.
Here's the URL:
https://www.cfr.duke.edu/new.cfm?showNewTemplate=1
The specific CSS:
#headerWrapper {
text-align: right;
margin-bottom: 25px;
}
#header {
width: 400px;
text-align: left;
padding-bottom: 5px;
border-bottom: 1px dotted #cccccc;
}
And the HTML code:
<div id="headerWrapper">
<div id="header">
<h1><cfoutput>#PAGE_TITLE#</cfoutput></h1>
<a class="orange" href="/">Corporate & Foundation Relations Homepage</a>
</div></div>
What do I need to do here?
Rick
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting,
up-to-date ColdFusion information by your peers, delivered to your door four
times a year.
http://www.fusionauthority.com/quarterly
Archive:
http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:250004
Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
