Home/ Questions/Q 7784423
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-01T20:05:34+00:00

Yellow bar is width:100% header I would like to achieve MAIN TEXT to be

  • 0

Yellow bar is width:100% header

I would like to achieve MAIN TEXT to be always CENTERED no matter the side text’s length.

Margins between text are 100px

Image:

enter image description here

Thanks in advance

EDIT : HTML and CSS so far:

HTML:

    <html>
    <head>
    </head>
    <body>
    <center>
    <div id="top"></div>
    Text Logo
    <span id="mainText"> Menu Links </span>
    Username: <?php echo $uname; ?>
    </center>
    </body>
    </html>

CSS: 

    #mainText {

    margin-right:100px;
    margin-left:100px;

    }
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    If i understand may be that’s you want.

    CSS

    .left{
    float:left;
    background:yellow;
}
.right{
    float:right;
    background:green;
}
.middle{
    display:inline-block;
    *display:inline/*For IE7*/
    *zoom:1;
    vertical-align:top;
    background:red;
    margin:0 100px;
}
.parent{
    text-align:center;
}
.parent div{
    text-align:left;
}

    HTML

    <div class="parent">
 <p class="left">L side Text</p>
 <p class="middle">Center side Text</p>
 <p class="right">R side Text</p>
</div>

    Check this http://jsfiddle.net/XhMtK/3/

    UPDATED

    May that’s you want

    Check this http://jsfiddle.net/XhMtK/4/

    • 0