Footer CSS alignment issue

  • Author
    Posts
  • #149763

    aingerman
    Member

    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

    #150045

    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.

    #150153

    aingerman
    Member

    Ah, ok. Thank you for the referal.

    #150154

    You are welcome. Good luck.

The topic ‘Footer CSS alignment issue’ is closed to new replies.