Styling the footer

	Home Register Search Help Login

Sponsors
Frontpage website templates
Creative Website Templates for FrontPage, Dreamweaver, Flash, SwishMax
Shopping Cart Software
Ecommerce software integrated into Frontpage, Dreamweaver and Golive templates. No monthly fees and available in ASP and PHP versions.
Website Templates
We also have a wide selection of Dreamweaver, Expression Web and Frontpage templates as well as webmaster tools and CSS layouts.

Recent Posts
Todays Posts
Most Active posts
Posts since last visit
My Recent Posts
Mark posts read

Styling the footer

View related threads: (in this forum | in all forums)

Logged in as: Guest

Users viewing this topic: none

Printable Version

All Forums >> Web Development >> Cascading Style Sheets and Accessibility >> Styling the footer

Page: [1]


vision2000 Posts: 541 From: USA Status: offline	Styling the footer - 6/29/2005 8:09:41 Hi, How can I make the right hand image be parrellel to the left one with the text left aligned between the 2 images in the footer? http://discount-real-estate-listings-md.com/index3.shtml Please scan my css style sheet to see if anything is wrong (it validates) I am just beginning to layout my web sites using css exclusively. Thank you

Tailslide

Posts: 6758
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline

RE: Styling the footer - 6/29/2005 8:25:44

Do you want the images to be within the black border of the footer or outside?

If you want them within the black footer border then I'd remove the Footerleft and footer-right div names and do this:
Add this to the CSS:

#footer img {float:left; padding-right:5px;}
.floatright{float:right; padding-left:5px;}

Change your HTML to this:

<div id="footer">
<img src="lennphotot.jpg" /><span class="floatright"><img src="FairHousing.gif" /></span>
Homefinders.com Broker: Lenn Harley Licensed real estate broker in Maryland and Virginia Homes@Homefinders.com 800-711-7988 
Copyright © 2005 Discount Real Estate Listings Maryland All Rights Reserved
</div>

BTW - It'll make life a lot easier for you if you stick all that CSS into a separate CSS file - that way it will apply globally throughout your site and you only have to edit it once!

Edit: forgot to say - you'll need to give your footer a specific height say height:100px because otherwise the border won't encompass the images in Standards compliant browsers. Also possibly worthwhile giving your footer a margin-bottom: 10px just to take it off the bottom of the page a bit - just a thought that last bit!

_____________________________

Little Blue Plane Web Design | Land Rover project

(in reply to vision2000)


vision2000 Posts: 541 From: USA Status: offline	RE: Styling the footer - 6/29/2005 10:23:45 Thanks for the tips - how can I center the footer on the page and left align the text without it hitting the image http://discount-real-estate-listings-md.com/index3.shtml I left the css visible so it is easier to troubleshoot...but will place in an external style sheet later. (in reply to Tailslide)


Tailslide Posts: 6758 Joined: 5/10/2005 From: Out here on the raggedy edge Status: offline	RE: Styling the footer - 6/29/2005 11:11:41 Hi It's a case of playing with the margins - so you'd need to do this: #footer{ height:100px; width: 567px; background-color: #E6E6DC; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; padding:5px; text-align:center; margin:0 auto 5px auto; border: 1px solid #000000; } _____________________________ Little Blue Plane Web Design \| Land Rover project (in reply to vision2000)


vision2000 Posts: 541 From: USA Status: offline	RE: Styling the footer - 6/29/2005 11:20:50 Thanks that worked great! (in reply to Tailslide)

Page: [1]

All Forums >> Web Development >> Cascading Style Sheets and Accessibility >> Styling the footer

Page: [1]

Jump to: 1

New Messages	No New Messages
Hot Topic w/ New Messages	Hot Topic w/o New Messages
Locked w/ New Messages	Locked w/o New Messages

Post New Thread

Reply to Message

Post New Poll

Submit Vote

Delete My Own Post

Delete My Own Thread

Rate Posts