Home/ Questions/Q 6701119
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T06:53:44+00:00

Please check out this link quickly: http://jsfiddle.net/8grSk/ As you can see the text as

  • 0

Please check out this link quickly:

http://jsfiddle.net/8grSk/

As you can see the text as the bottom is aligned to the left side of the page

I want to add text to the right side of the page inline with the text already present.

How is this done?

I am finding it difficult to align all these divs!

Thanks guys!

James

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You can easily rewrite everything to accommodate two regions (left and right) inside of your footer id like so:

    HTML

    <html>
<head>
<link href="test.css" rel="stylesheet" type="text/css" />
</head>

<body>

<div id="footer" style="position:absolute;bottom:0;">

<div class="left">
    <a href="#">About Us</a>
    <a href="#">Accessibility</a>
    <a href="#">Recruiters</a>
    <a href="#">Contact Us</a>
</div>
<div class="right">
    <a href="#">About Us</a>
    <a href="#">Accessibility</a>
    <a href="#">Recruiters</a>
    <a href="#">Contact Us</a>
</div>

</div>

</body>

</html>

    CSS

     body {
    margin: 0;
    padding: 0;
}

#footer {
    background: #FFFFFF;
    border: 1px solid;
    color: #e6e6e6;
    height: 30px;
    width: 960px;
    position:absolute;
    float: left;
    margin: 0px 0px 0px 0px;
    padding:0;
}

#footer a {
    font: 13px helvetica;
    color: #0040FF;
    padding: 8px 12px 3px 3px;
}

#footer a:hover {
    font: 13px helvetica;
    color: #0040FF;
    padding: 8px 3px 3px 3px;
    text-decoration: underline;
}

.right {
    float:right;
}

.left {
    float:left;
}

    demo

    http://jsfiddle.net/8grSk/8/

    — edit

    changed the fiddle to accommodate for your hover state better.

    • 0