Need help? Check out our Support site, then


Footer CSS alignment issue

  1. I am using the WordPress theme 'Red Train'. I have changed the Header image and mapped it ok in CSS. My issue is with the footer - I added an image to the footer, but it wont align in the same position as the header. It moves over to the right and up from the bottom. I need it to lay in line with the header and aligned against the bottom of the frame.

    Website is: http://www.resrandi.com

    The footer code is:
    ' <div id="footer">
    </div>
    </div><!-- /Ende von id="content" -->

    </div><!-- /Ende vin id="container" -->
    <?php wp_footer(); ?>
    </body>
    </html>'

    The stylesheet css is long, here:
    '/*
    Theme Name: Red Train
    Theme URI: http://www.perun.net/
    Description: Red Train is a Theme for WP 2.x. Made by Vladimir Simovic (Perun).
    Version: 2.x
    Author: Vladimir Simovic
    Author URI: http://www.vlad-design.de

    The CSS, XHTML and design is released under GPL:
    http://www.opensource.org/licenses/gpl-license.php
    */

    body {
    background: #320000 url(images/hintergrund.gif) repeat-x fixed;
    text-align: center;
    padding: 1em 0;
    font: 62.5% verdana, sans-serif;
    }

    a {
    color: #ffc;
    }

    a:hover {
    color: #fff;
    text-decoration: none;
    }

    hr {
    display: none;
    }

    img {
    border: none;
    }

    ins {
    text-decoration: none;
    border-bottom: 1px dashed #eee;
    }

    acronym, abbr, dfn {
    border-bottom: 1px dashed #eee;
    font-style: normal;
    }

    blockquote {
    border-left: 5px solid #320000;
    margin: 1em 0;
    padding: 10px;
    background: #600000;
    width: 100%;
    }

    code, pre {
    color: #f93;
    font-family: verdana, sans-serif;
    }

    .bild-links {
    float: left;
    margin: 0 15px 3px 0;
    }

    .bild-rechts {
    float: right;
    margin: 0 0 3px 15px;
    }

    .center {
    text-align: center;
    }

    .pagination {
    text-align: center;
    margin-top: 2em;
    }

    .search-button, #commentform input {
    font-size: 1em;
    font-weight: bold;
    border: 1px solid #300000;
    background: #800000;
    color: #ffc;
    padding: 1px 2px;
    }

    #container {
    margin: 0 auto;
    text-align: left;
    width: 730px;
    border-left: 1px solid #eee;
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;
    background: url(images/container.gif);
    color: #eee;
    line-height: 1.5;
    }

    #header {
    height: 442px;
    background: url(images/bahn.jpg) no-repeat;
    margin: -25px auto 0 !important;
    position: relative !important;
    padding-top: 0px;

    }

    #header a:link, #header a:visited { text-decoration: none; border: none; }
    /* line above ensures that header hyperlinks are not underlined */
    a.chpsamples {
    position: absolute;
    display: block;
    text-indent: -9999px; /* moves link text off-screen */
    background: transparent;
    left: 255px; /* taken from Photoshop slice info “X” */
    top: 82px; /* taken from Photoshop slice info “Y” */
    width: 87px; /* taken from Photoshop slice info “W” */
    height: 21px; /* taken from Photoshop slice info “H” */
    cursor: pointer;
    border: 0px;

    }

    #header a:link, #header a:visited { text-decoration: none; border: none; }
    /* line above ensures that header hyperlinks are not underlined */
    a.audiobook {
    position: absolute;
    display: block;
    text-indent: -9999px; /* moves link text off-screen */
    background: transparent;
    left: 342px; /* taken from Photoshop slice info "X" */
    top: 82px; /* taken from Photoshop slice info "Y" */
    width: 57px; /* taken from Photoshop slice info "W" */
    height: 21px; /* taken from Photoshop slice info "H" */
    cursor: pointer;
    border: 0px;

    }

    #header a:link, #header a:visited { text-decoration: none; border: none; }
    /* line above ensures that header hyperlinks are not underlined */
    a.bio {
    position: absolute;
    display: block;
    text-indent: -9999px; /* moves link text off-screen */
    background: transparent;
    left: 399px; /* taken from Photoshop slice info "X" */
    top: 82px; /* taken from Photoshop slice info "Y" */
    width: 57px; /* taken from Photoshop slice info "W" */
    height: 21px; /* taken from Photoshop slice info "H" */
    cursor: pointer;
    border: 0px;

    }

    #header a:link, #header a:visited { text-decoration: none; border: none; }
    /* line above ensures that header hyperlinks are not underlined */
    a.reviews {
    position: absolute;
    display: block;
    text-indent: -9999px; /* moves link text off-screen */
    background: transparent;
    left: 456px; /* taken from Photoshop slice info "X" */
    top: 47px; /* taken from Photoshop slice info "Y" */
    width: 82px; /* taken from Photoshop slice info "W" */
    height: 21px; /* taken from Photoshop slice info "H" */
    cursor: pointer;
    border: 0px;

    }

    #header a:link, #header a:visited { text-decoration: none; border: none; }
    /* line above ensures that header hyperlinks are not underlined */
    a.order {
    position: absolute;
    display: block;
    text-indent: -9999px; /* moves link text off-screen */
    background: transparent;
    left: 503px; /* taken from Photoshop slice info "X" */
    top: 82px; /* taken from Photoshop slice info "Y" */
    width: 70px; /* taken from Photoshop slice info "W" */
    height: 21px; /* taken from Photoshop slice info "H" */
    cursor: pointer;
    border: 0px;

    }

    #header a:link, #header a:visited { text-decoration: none; border: none; }
    /* line above ensures that header hyperlinks are not underlined */
    a.discuss {
    position: absolute;
    display: block;
    text-indent: -9999px; /* moves link text off-screen */
    background: transparent;
    left: 259px; /* taken from Photoshop slice info "X" */
    top: 114px; /* taken from Photoshop slice info "Y" */
    width: 83px; /* taken from Photoshop slice info "W" */
    height: 19px; /* taken from Photoshop slice info "H" */
    cursor: pointer;
    border: 0px;

    }

    #header a:link, #header a:visited { text-decoration: none; border: none; }
    /* line above ensures that header hyperlinks are not underlined */
    a.events {
    position: absolute;
    display: block;
    text-indent: -9999px; /* moves link text off-screen */
    background: transparent;
    left: 342px; /* taken from Photoshop slice info "X" */
    top: 114px; /* taken from Photoshop slice info "Y" */
    width: 89px; /* taken from Photoshop slice info "W" */
    height: 19px; /* taken from Photoshop slice info "H" */
    cursor: pointer;
    border: 0px;

    }

    #header a:link, #header a:visited { text-decoration: none; border: none; }
    /* line above ensures that header hyperlinks are not underlined */
    a.blog {
    position: absolute;
    display: block;
    text-indent: -9999px; /* moves link text off-screen */
    background: transparent;
    left: 431px; /* taken from Photoshop slice info "X" */
    top: 114px; /* taken from Photoshop slice info "Y" */
    width: 30px; /* taken from Photoshop slice info "W" */
    height: 19px; /* taken from Photoshop slice info "H" */
    cursor: pointer;
    border: 0px;

    }

    #header a:link, #header a:visited { text-decoration: none; border: none; }
    /* line above ensures that header hyperlinks are not underlined */
    a.contact {
    position: absolute;
    display: block;
    text-indent: -9999px; /* moves link text off-screen */
    background: transparent;
    left: 456px; /* taken from Photoshop slice info "X" */
    top: 47px; /* taken from Photoshop slice info "Y" */
    width: 82px; /* taken from Photoshop slice info "W" */
    height: 21px; /* taken from Photoshop slice info "H" */
    cursor: pointer;
    border: 0px;

    }

    #header a:link, #header a:visited { text-decoration: none; border: none; }
    /* line above ensures that header hyperlinks are not underlined */
    a.home {
    position: absolute;
    display: block;
    text-indent: -9999px; /* moves link text off-screen */
    background: transparent;
    left: 5px; /* taken from Photoshop slice info "X" */
    top: 107px; /* taken from Photoshop slice info "Y" */
    width: 238px; /* taken from Photoshop slice info "W" */
    height: 51px; /* taken from Photoshop slice info "H" */
    cursor: pointer;
    border: 0px;

    }

    #header h1 {
    font: italic 22px georgia, serif;
    color: #fff;
    line-height: 200px;
    padding: 0 15px;
    }

    #header h1 a {
    color: #fff;
    text-decoration: none;
    }

    #content {
    margin: 1em 215px 1.5em 15px;
    font-size: 1.1em;
    }

    #content h2 {
    font: italic 2.1em georgia, serif;
    margin: 5px 0;
    letter-spacing: 1px;
    }

    #content h2 a {
    text-decoration: none;
    }

    #content h3 {
    margin: 1.2em 0 .4em 0;
    font-size: 1.4em;
    }

    #content h4 {
    font-size: 1.3em;
    padding: 0;
    margin: 1em 0;
    }

    #content h5 {
    font-size: 1.1em;
    padding: 0;
    margin: 1em 0;
    }

    #content .date {
    font-size: 1em;
    text-align: right;
    font-weight: bold;
    }

    #content .meta {
    font-size: .9em;
    }

    #content .feedback {
    margin: 15px 0 15px 0;
    text-align: right;
    padding-bottom: 10px;
    border-bottom: 1px solid #700000;
    }

    #commentlist li {
    margin-bottom: 1.5em;
    padding-bottom: 1em;
    border-bottom: 1px solid #700000;
    }

    #commentform {
    margin: 1em 0;
    padding: 1em;
    border: 1px solid #300000;
    background: #600000;
    }

    #commentform textarea {
    background: #eee;
    border: 1px solid #300000;
    }

    #commentform #email, #commentform #author, #commentform #url {
    font-size: 1.1em;
    background: #eee;
    border: 1px solid #300000;
    width: 180px;
    }

    #footer {
    background: url(images/RR_Footer.jpg) bottom repeat-x !important;
    height: 320px;
    width: 732px;
    margin: 0px auto 0 !important;
    position: relative !important;

    }

    /* *** Plugins *** */
    .tags {
    margin: 1.5em 0;
    font-weight: bold;
    padding: 2px 0;
    }

    #wp_grins {
    margin-top: 0px;
    }

    .pagebar {
    text-align: center;
    line-height: 1.4;
    margin-top: 2em;
    }

    .pagebar .this-page {
    font-weight: bold;
    }

    .pagebar a {
    border: 1px solid #300000;
    background: #900;
    padding: 2px 5px;
    margin-bottom: 5px;
    text-decoration: none;
    color: #ffc;
    }

    .pagebar a:hover {
    color: #fff;
    }'

    Any thoughts?

    A.Ingerman

  2. Here at wordpress.com, we do not have "red train" so I think your blog must be self-hosted using the software from wordpress.org. You will need to ask your question over at http://wordpress.org/support/ as we use different software here.

  3. Ah, ok. Thank you for the referal.

  4. You are welcome. Good luck.

Topic Closed

This topic has been closed to new replies.

About this Topic