Log In · Register

 
In dire need of help!, I need this site up before the 28th
wintermelody
post Aug 20 2008, 12:27 AM
Post #1


Senior Member
***

Group: Member
Posts: 31
Joined: Jul 2007
Member No: 552,713
Hello all :3

I'm a webmaster for my club but this is actually my first time coding one [I used a blog as a website last year].

I really need help on centering the footer image (w/ hearts to the side - caring - is our way of life) to the bottom, and stay there, regardless how big the content box is [the big white box on the left].

here is a screen shot;;


the code;
CODE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML

1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transiti

onal.dtd">
<HTML>
<HEAD>
<TITLE>SLHS's Key Club - The Kiwis!

=)</TITLE>
<META HTTP-EQUIV="Content-Type"

CONTENT="text/html; charset=iso-8859-1">
<link href="style.css" rel="stylesheet"

type="text/css">
</HEAD>

<body>
<center>
<BODY BGCOLOR=#F1F3F4 LEFTMARGIN=0

TOPMARGIN=0 MARGINWIDTH=0

MARGINHEIGHT=0>
<!-- ImageReady Slices (Untitled-2) -->
<TABLE WIDTH=540 BORDER=0

CELLPADDING=0 CELLSPACING=0>
<TR>
<TD>
<IMG

SRC="images/index_01.jpg" WIDTH=540

HEIGHT=90 ALT=""></TD>
</TR>
<TR>
<TD>
<IMG

SRC="images/index_02.jpg" WIDTH=540

HEIGHT=89 ALT=""></TD>
</TR>
<TR>
<TD>
<IMG

SRC="images/index_03.jpg" WIDTH=540

HEIGHT=90 ALT=""></TD>
</TR>
<TR>
<TD>
<IMG

SRC="images/index_04.jpg" WIDTH=540

HEIGHT=89 ALT=""></TD>
</TR>
<TR>
<TD>
<IMG

SRC="images/index_05.jpg" WIDTH=540

HEIGHT=442 ALT=""></TD>
</TR>



</TABLE>
<!-- End ImageReady Slices -->

<!-- START OF CONTENT -->

<div id="content">
<table width="400" border="0" cellspacing="0"

cellpadding="0">
<tr><td class="content">


<h3>Shall be updated soon :P</h3>

</tr></td>
</div>
</table>

<!-- End of Content -->

<TD>
<IMG

SRC="images/footer.jpg" WIDTH=567

HEIGHT=78 ALT=""></TD>
</TR>



<!-- Start of Navigation -->
<div id="navigation">
<table width="149" border="0" cellspacing="0"

cellpadding="0">
<tr><td class="navigation">

<a href="xx">testing</a>
<h1>testing</h1>
<h2>testing</h2>


</tr></td>
</div>
</table>
<!-- End of Navigation -->

</table>
</center>

</BODY>
</HTML>


the css;
CODE
#navigation {
background-color: #FFF;
font-family: Georgia, Arial, sans-serif;
font-align: right;
font-color: #7F8081;
position: absolute;
top: 0px;
left: -165px;
width: 149px;
height: 349px;
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
padding-bottom: 0px;
}

#content {
background-color: #FFF;
font-family: Georgia, Arial, sans-serif;
font-align: right;
font-color: #7F8081;
position: absolute;
top: 350px;
left: 404px;
width: 400px;
height: 388px;
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
padding-bottom: 0px;
}

a:link {
color: #C0DBBA;
font-family: Georgia;
font-size: x-small;
background:#FFFFFF;
text-transform: none;
text-decoration: none;

}

a:visited {
color: #53B1B8;
font-family: Georgia;
font-size: x-small;
background:#FFFFFF;
text-transform: none;
text-decoration: none;

}

a:hover {
color: #E69747;
font-family: Georgia;
font-size: x-small;
background:#FFFFFF;
text-transform: none;
text-decoration: none;
cursor: nw-resize;
font-weight: bold;

}

body{
background-color: #F1F3F4;
font-color: #7F8081;
font-weight: none;
font-family: Georgia, Arial, Sans-Serif;
font-size: x-small;
margin: 0px auto;
padding: 0px;
text-align: JUSTIFY;
scrollbar-face-color: #F1F3F4;
scrollbar-shadow-color: #F1F3F4;
scrollbar-3dlight-color: #F1F3F4;
scrollbar-arrow-color: #755139;
scrollbar-track-color: #F1F3F4;
scrollbar-darkshadow-color: #F1F3F4;
scrollbar-highlight-color: #F1F3F4;
}

table, td, tr {
background-image: url('images/footer.jpg')
background-position: 20px 45px;
background-color: #FFF;
font-color: #B0B3B4;
font-family: Georgia;
font-size: x-small;
border: none;
}

h1 {
color: #D89A05;
letter-spacing: -1px;
text-align: center;
font-family: Georgia;
margin: 10px 0px 0px 0px;
line-height: 15px;
}

h2 {
color: #01A67D;
font-size: 15px;
letter-spacing: -1px;
text-align: center;
font-family: Georgia;
margin: 10px 0px 0px 0px;
font-variant: small-caps;
}

b {
color: #6BA24F;}

i, em {
color: #915023;}

u {
color: #27A2AD;}

input, textarea {
border: none;
color: #c0c0c0;
font-family: Georgia;
font-size: x-small;
background: #FFFFFFF;}


pleaaaaaaase! someone help me! i'm getting so frustrated and my head hurts D:
 
 
 Start new topic
Replies
wintermelody
post Aug 21 2008, 12:20 PM
Post #2


Senior Member
***

Group: Member
Posts: 31
Joined: Jul 2007
Member No: 552,713
Say wha now? o___o i want it centered under both navi & content. ><

Well, I guess it looks okay not in the center? But then if I encounter this problem again, then I would know what to do...how irritating x__x

code;
CODE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML

1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<HTML>
<HEAD>
<TITLE>SLHS's Key Club - The Kiwis! =)</TITLE>
<META HTTP-EQUIV="Content-Type"

CONTENT="text/html; charset=iso-8859-1">
<link href="style.css" rel="stylesheet"

type="text/css">
</HEAD>

<body>
<center>
<BODY BGCOLOR=#F1F3F4 LEFTMARGIN=0

TOPMARGIN=0 MARGINWIDTH=0

MARGINHEIGHT=0>
<!-- ImageReady Slices (Untitled-2) -->
<TABLE WIDTH=540 BORDER=0

CELLPADDING=0 CELLSPACING=0>
<TR>
<TD>
<IMG

SRC="images/index_01.jpg" WIDTH=540

HEIGHT=90 ALT=""></TD>
</TR>
<TR>
<TD>
<IMG

SRC="images/index_02.jpg" WIDTH=540

HEIGHT=89 ALT=""></TD>
</TR>
<TR>
<TD>
<IMG

SRC="images/index_03.jpg" WIDTH=540

HEIGHT=90 ALT=""></TD>
</TR>
<TR>
<TD>
<IMG

SRC="images/index_04.jpg" WIDTH=540

HEIGHT=89 ALT=""></TD>
</TR>
<TR>
<TD>
<IMG

SRC="images/index_05.jpg" WIDTH=540

HEIGHT=442 ALT=""></TD>
</TR>



</TABLE>
<!-- End ImageReady Slices -->

<!-- START OF CONTENT -->

<div id="content">
<table width="400" border="0" cellspacing="0"

cellpadding="0">
<tr><td class="content">

<h1><span>&brvbar; Welcome :)</span></h1>

<img src="images/avatar.png" align="left">To the <u>08-09</u> website for SL! :] I've <em>painstakingly</em> labored many hours and days coding and designing for <strong>you</strong>. Please be aware that this is the <u>actual</u> first website I've ever created myself. It would be <em>most</em> kind of you to bookmark this site; or however else you're gonna remember the url.

<p>Other than that, enjoy the site. =]





</p></tr></td>
</div>
</table>

<!-- End of Content -->

<div id="footer">
</div>



<!-- Start of Navigation -->
<div id="navigation">
<table width="149" border="0" cellspacing="0"

cellpadding="0">
<tr><td class="navigation">

<h1><span>&rarr; Navigation</span></h1>
&amp; <a href="index.html">Main</a><br />
&amp; <a href="aboutkc.html">About</a><br />
&amp; <a href="members.html">Board Members</a><br />
&amp; <a href="events.html">Events</a><br />
&amp; <a href="fundraisers.html">Fundraisers</a><br />
&amp; <a href="slkeyclub.dotphoto.com">Photo Gallery</a><br />
&amp; <a href="hours.html">Member Hours</a><br />
&amp; <a href="newsletters.html">Newsletters</a><br />
&amp; <a href="cheers.html">D2 Cheers</a><br />
&amp; <a href="chat.html">Time To Chat!</a><br />
&amp; <a href="credits.html">Credits</a>


<h1><span>&rarr; Other Links</span></h1>
&amp; <a href="http://cnhkeyclub.org/">CNH Key Club</a><br />
&amp; <a href="http://d2kiwis.org">D2 Kiwis</a><br />
&amp; <a href="http://www.keyclub.org/">Key Club International</a><br />
&amp; <a href="http://alamedakeyclub.bravehost.com">Alameda</a><br />
&amp; <a href="http://ehskeywees.org/">Encinal</a><br />
&amp; <a href="http://www.ohskeyclub.org/">Oakland</a><br /><br />
<center>Site &copy; <strong>Debra Cheung</strong>
<br />
Kiwi Art &copy; <strong>Amanda Vien</strong>
</center>


</tr></td>
</div>
</table>
<!-- End of Navigation -->

</table>
</center>

</BODY>
</HTML>


css;
CODE
#navigation {
background-color: #FFF;
font-family: Georgia, Arial, sans-serif;
font-align: right;
font-color: #7F8081;
position: absolute;
top: 0px;
left: -165px;
width: 149px;
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
padding-bottom: 0px;}

#content {
background-color: #FFF;
font-family: Verdana, Sans-serif;
font-align: right;
font-color: #7F8081;
position : absolute;
top: 360px;
left: 400px;
width: 363px;
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
padding-bottom: 0px;}

#footer {
clear: both;
width: 400px;
height: 76px;
background: url('images/xfooterms1.jpg') no-repeat;
margin: 0 auto;}

a:link {
color: #7D563C;
font-family: Georgia;
font-size: x-small;
background:#FFFFFF;
text-transform: none;
text-decoration: none;}

a:visited {
color: #53B1B8;
font-family: Georgia;
font-size: x-small;
background:#FFFFFF;
text-transform: none;
text-decoration: line-through;}

a:hover {
color: #E69747;
font-family: Georgia;
font-size: x-small;
background:#FFFFFF;
text-transform: none;
text-decoration: none;
cursor: nw-resize;
font-weight: bold;}

body{
background-color: #F1F3F4;
font-color: #7F8081;
font-weight: none;
font-family: Georgia, Arial, Sans-Serif;
font-size: x-small;
margin: 0px auto;
padding: 0px;
text-align: JUSTIFY;
scrollbar-face-color: #F1F3F4;
scrollbar-shadow-color: #F1F3F4;
scrollbar-3dlight-color: #F1F3F4;
scrollbar-arrow-color: #755139;
scrollbar-track-color: #F1F3F4;
scrollbar-darkshadow-color: #F1F3F4;
scrollbar-highlight-color: #F1F3F4;}

table, td, tr {
background-color: #FFF;
font-color: #B0B3B4;
font-family: Verdana, Georgia;
font-size: x-small;
border: none;}

h1 {
border-bottom: 2px dotted #088306;
background-color: #8ABD70;
padding: 3px;
font-family: Trebuchet MS, Verdana, Arial;
font-size: 1.5em;
letter-spacing: 1px;}

h1 span {
color: #FFFFFF;}

h2 {
color: #01A67D;
font-size: 15px;
letter-spacing: -1px;
text-align: center;
font-family: Georgia;
margin: 10px 0px 0px 0px;
font-variant: small-caps;}

b, strong {
color: #3E7E48;}

i, em {
color: #915023;
font-family: Georgia}

u {
color: #27A2AD;}

input, textarea {
border: none;
color: #c0c0c0;
font-family: Georgia;
font-size: x-small;
background: #FFFFFFF;}
 

Posts in this topic
wintermelody   In dire need of help!   Aug 20 2008, 12:27 AM
SkyliteX   try putting the img between the </table> and...   Aug 20 2008, 12:30 AM
wintermelody   I did, but it's still not at the bottom >...   Aug 20 2008, 12:36 AM
SkyliteX   wait whats the div tag for the section right under...   Aug 20 2008, 12:47 AM
wintermelody   wait, where?   Aug 20 2008, 01:02 AM
SkyliteX   you know how in the image there is like a white bo...   Aug 20 2008, 01:09 AM
wintermelody   i think I know what you're talking about... t...   Aug 20 2008, 01:14 AM
dreamgurl36   Okay....so right now, your whole layout is properl...   Aug 20 2008, 01:05 PM
wintermelody   Ok...I've done that; I've taken out the he...   Aug 20 2008, 01:23 PM
dreamgurl36   Don't forget to replace the XX in the height o...   Aug 20 2008, 01:31 PM
wintermelody   This is what happened;;   Aug 20 2008, 01:35 PM
dreamgurl36   The "bottom" problem is fixed. It's ...   Aug 20 2008, 02:33 PM
wintermelody   Yea, the "bottom" part is fixed; now tha...   Aug 20 2008, 02:50 PM
dreamgurl36   Do you mind posting just the footer image for me t...   Aug 20 2008, 03:06 PM
wintermelody   Okie doke, here it is; i g2g now for tennis but...   Aug 20 2008, 03:12 PM
dreamgurl36   Have fun! When you come back, try using thi...   Aug 20 2008, 03:39 PM
wintermelody   I am back! Muwahaha So, I did that, & H...   Aug 20 2008, 07:34 PM
dreamgurl36   I think I understand now. You can add the height a...   Aug 21 2008, 05:27 AM
wintermelody   Say wha now? o___o i want it centered under both n...   Aug 21 2008, 12:20 PM
wintermelody   Nvm. I'll just keep the footer there, then. It...   Aug 21 2008, 08:48 PM
Insurmountable   So did you figure it out, is it fixed? If not if y...   Aug 21 2008, 11:33 PM
wintermelody   Er...well...now the only really tiny problem I hav...   Aug 22 2008, 12:42 AM
wintermelody   I'm officially done w/ this site now :]   Aug 22 2008, 05:42 PM
jaeminnie   QUOTE(wintermelody @ Aug 22 2008, 06:42 P...   Aug 22 2008, 05:43 PM

« Next Oldest · Webmasters' Corner Resolved Topics · Next Newest »
 

Closed TopicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 

Display Mode: Switch to: Standard · Switch to: Linear+ · Outline

Track this topic · Email this topic · Print this topic