trying to get rid of the footer white rectangle at the bottom of page

  • veenublue

    (@veenublue)


    15 years, 3 months ago

    at http://www.gluesky.com/

    here is the footer code:

    /* ----------- Footer ----------- */

#footer{
	height:420px;
	width:100%;
	background-color:#FFFFFF;
	background-image:url('img/footer.png');
	background-repeat:repeat-x;
	clear:both;
	margin-bottom:0;
	color:#4D5E7C;
	}

#footerimg{
	width:1000px;
	height:390px;
	background-image:url('img/footer.png');
	background-color:#FFFFFF;

	}

    and in the footer file:

    <div id="footer">
	<div id="footerimg">
	</div>
    		<p><?php bloginfo('name'); ?> is proudly powered by <a href="http://wordpress.org/">WordPress <?php bloginfo('version'); ?></a> | <a href="<?php bloginfo('rss2_url'); ?>">Entries (RSS)</a> | <a href="<?php bloginfo('comments_rss2_url'); ?>">Comments (RSS)</a> </a></p>
</div>

    and where do I give credit to the theme I used as a starting point? The images are all mine, just the base theme I began with. Thanks!

Viewing 9 replies - 1 through 9 (of 9 total)
  • drewactual

    (@drewactual)

    15 years, 3 months ago

    make:

    /* ----------- Footer ----------- */

#footer{
	height:420px;
	width:100%;
	background-color:#FFFFFF;
	background-image:url('img/footer.png');
	background-repeat:repeat-x;
	clear:both;
	margin-bottom:0;
	color:#4D5E7C;
	}

#footerimg{
	width:1000px;
	height:390px;
	background-image:url('img/footer.png');
	background-color:#FFFFFF;

	}

    this:

    /* ----------- Footer ----------- */

#footer{
	height:420px;
	width:100%;
	background-color:transparent;
	background-image:url('img/footer.png');
	background-repeat:repeat-x;
	clear:both;
	margin-bottom:0;
	color:#4D5E7C;
        display:none;
	}

#footerimg{
	width:1000px;
	height:390px;
	background-image:url('img/footer.png');
	background-color:transparent;

	}

    If you want to allow the credits, which is good of you to do so, remove the display:none; tag from #footer

    Thread Starter veenublue

    (@veenublue)

    15 years, 3 months ago

    Yay! Thank you!

    Thread Starter veenublue

    (@veenublue)

    15 years, 3 months ago

    Hmm, it made the entire bottom disappear. I would love to keep the watercolor and just get rid of the white bar. I would like the text to stay though, just over the watercolor. Any ideas?

    bekabug

    (@bekabug)

    15 years, 3 months ago

    #footerimg{
	height:5px;
	}

    Take everything out of footerimg but height, as shown above.

    Does that look better?

    drewactual

    (@drewactual)

    15 years, 3 months ago

    the trick is the transparent declaration for background-color…

    go back and delete the line display:none; and you will be golden… or kinda blue as it is… 🙂

    bekabug

    (@bekabug)

    15 years, 3 months ago

    If you look at the current live version of the site, it appears that this person has already removed display: none

    From what I am reading is that they don’t want it all the way underneath the watercolor at the very bottom.

    Changing the height declaration brings it up above the repeating footer image.

    Also, why declare the footer.png as a background image twice?

    Thread Starter veenublue

    (@veenublue)

    15 years, 3 months ago

    Ok I tried both, getting rid of the display:none didn’t seem to do anything (the version up right now has it removed) and the block of what is now blue is still there. I tried changing it to just the height (as bekabug suggested) and the text moved up to the watercolor, but the block of blue is still at the bottom.

    The background image twice is left over from the theme I started with “strange-little-town” and since I am new to making a blog, I have no idea which to get rid of! 🙂

    Thank you for brainstorming, any other ideas? Should I look for some other code somewhere?

    bekabug

    (@bekabug)

    15 years, 3 months ago

    I see what you’re saying.

    Study this and see if you can make it work

    http://ryanfait.com/sticky-footer/

    bekabug

    (@bekabug)

    15 years, 3 months ago

    You’re going to want to delete the footerimg div from the theme itself. It is empty and it’s only purpose is to push the text to the bottom of the page. Once you do that the footer text will place itself directly beneath your content and above the bottom watercolor.

    The wrapper class that this theme is using looks pretty useless so you might want to create your own “wrapper” and declare it it as an ID …something like “full-wrapper”

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘trying to get rid of the footer white rectangle at the bottom of page’ is closed to new replies.