Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ Cascading Style Sheets _ Changing Height of Footer in CSS

Posted by: FlaPnthrsPunk Mar 15 2012, 08:05 AM

Hello everyone,

I am a web/graphic designer at a company called Executive Travel Link. Our site can be found at http://www.executivetravellink.com.

I am having a bit of an issue with an easy fix regarding changing the height of the Footer. We had our site built by another company and the designer whom worked on it is no longer responsible for doing any work for us.

We had our SSL Certificate for the site registered with GoDaddy and I am trying put their Trust Seal logo into our Footer by the code provided from them. However, the large height of the Trust Seal is dragging down the other logos that were created in our Footer to the point that you can only see the top halves of the logos.

The way that the designer created our Footer was mainly through a CSS file. I am a novice overall at CSS and after a few hours of trying to get it to look right and coming up unsuccessful, I felt it was probably best to see if there was anyone whom could give some advice or assistance with this problem.

I will provide the code for the Footer, CSS, and GoDaddy Trust Seal below. Any help that could be given would be much much appreciated!

Thank You!


Footer Code:

<!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="he" lang="he">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<title>Executive Travel Link</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<link href="style.css" type="text/css" rel="stylesheet" />
<meta name="keywords" content="" />
<meta name="description" content="" />
</head>
<body>
<div class="footer">
<div class="float_left">
<a target="_parent" href="http://www.executivetravellink.com">Home</a> | 
<a target="_parent"href="http://details.executivetravellink.com/about-us.htm">About Us</a> | 
<a target="_parent" href="http://www.executivetravellink.com/contact-us.htm">Contact Us</a> | 
<span class="tel">Call Us: 855-243-5561</span>
</div>
<div class="float_right">
<img class="cards" src="cards.png" alt="logos" title="logos"/>
</div>
</div>
</body>
</html>


CSS Code (for the Footer section):

.footer{font-family:arial;font-size:12px;color:#5e5e5e;width:980px;height:28px;background:url(footer_bg.jpg) repeat-x;padding:9px 10px 0px 10px;}

.footer a{color:#5e5e5e; text-decoration:none;}

.footer a:hover{text-decoration:underline;}

.cards{vertical-align:middle;margin-left:10px;}

.seal{vertical-align:middle;margin-left:10px;}

.footer .tel{color:#c00000; font-weight:bold;}


GoDaddy Trust Seal Code:

<span id="siteseal"><script type="text/javascript" src="https://seal.godaddy.com/getSeal?sealID=KFHPuTChwFUJEViHL7RyWg1D7LlZ2jhS6pfMSTHd0TOItdQqvI"></script><br/><a style="font-family: arial; font-size: 9px" href="https://www.godaddy.com/ssl/ssl-certificates.aspx" target="_blank">ssl certificates</a></span>

Posted by: pandy Mar 16 2012, 09:12 AM

It's complicated. The person who created your page liked to obfuscate things and has created the footer as its own page, shown in an iframe.
http://www.executivetravellink.com/UI_NET/FileHandler.ashx?fileName=dd57b30c-92ff-4414-b6f9-fd943da123d7.html&ParentTheme=ResRedParentCulture=&IsIframe=true
I'm not able to get to your style sheet but chances are the background image won't work if you increase the height. Moreover the iframe probably has a height.

Godaddy's JS ads markup and inserts a flash file which complicates things even more. Couldn't you just copy the logo and write a normal link? That would make it a little easier anyway.

Posted by: FlaPnthrsPunk Mar 16 2012, 01:17 PM

QUOTE(pandy @ Mar 16 2012, 10:12 AM) *

It's complicated. The person who created your page liked to obfuscate things and has created the footer as its own page, shown in an iframe.
http://www.executivetravellink.com/UI_NET/FileHandler.ashx?fileName=dd57b30c-92ff-4414-b6f9-fd943da123d7.html&ParentTheme=ResRedParentCulture=&IsIframe=true
Couldn't you just copy the logo and write a normal link? That would make it a little easier anyway.


Thanks for the advice biggrin.gif I thought of that originally and suggested it to my boss, but he said he'd rather not change things with the way GoDaddy already had it. I'm probably going to end up telling him it's the easiest way that I could think of getting it done.

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)