[SOLVED] Masterpage footer alignment doesn't align correctly

Issue

I am having a hard time putting footer content at the bottom of the page, at this moment it’s right aligned and I have no idea what else to do to put below the content.

See the image attachment to see how does it look at this moment:

screenshot

The content from the master page you can find it below:

       <div style="clear:both;"></div>
 
                      <!-- FOOTER -->
       <div class="footer">          
            <asp:Image ID="Image2" runat="server" 
                    ImageUrl="~/App_Themes/nopBlue/icons/facebook.png" CssClass="facebook"  />
            <asp:Image ID="Image3" runat="server" 
                    ImageUrl="~/App_Themes/nopBlue/icons/twitter.png" CssClass="twitter" />
            <asp:Image ID="Image4" runat="server" 
                    ImageUrl="~/App_Themes/nopBlue/icons/linkedin.png" CssClass="linkedin" />         
        </div> 
        <!-- End FOOTER -->

  

and the css file for the footer:

.footer
{
    color: #4e5766;
    padding: 8px 0px 0px 0px;
    margin: 0px auto;
    text-align: center;
    line-height: normal;
    width:100%;
}

Update

Here is the code from the browser:

http://jsfiddle.net/laziale/seZT8/

Second update

Here is the online url for the problem page:

http://www.5280.bz/d/nopCommerceSite/Cellphones.aspx

Solution

  • First you should fix all your validation errors, lot’s of thing to be fixed…

  • The positioning is caused by to missing </div> – the footer is nested within the newsletter block. Add two times </div> just before <!-- End RIGHT Side -->

  • Then change #footer css to:

    text-align:center;
    width:100%;
    
  • That should fix it…

Answered By – ptriek

Answer Checked By – Dawn Plyler (BugsFixing Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *