Home/ Questions/Q 8252959
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-08T00:42:33+00:00

Possible Duplicate: how to create a table layout with float in css #inner {

  • 0

Possible Duplicate:
how to create a table layout with float in css 

    #inner
{

 height:700px;

    }
div.content
{   
    float:left;
  width:95%;

}
    div.content span.first
    {
        display:block;
        float:left;
        width:25%;
        overflow:hidden;

    }
    div.content span.second
    {
        clear:both;
        display:block;
        float:right;
         width:25%;

    }
    div.content span.third
    {
        clear:both;
        display:block;
        float:right;
        width:25%;

    }
</style>


<body>

    <div id="outer">
          <div id="inner">
          <div class="content">
            <span class="first">
           HELLO
        </span>
       </div>

    <div class="content">
      <span class="second">
      pRERNA
          </span>
      </div>

   <div class="content">
      <span class="third">
      gOLANI
       </span>
    </div>

When working with pixels is working but not with percentage why?I want to create three columns of equal width.If outer element is 72%.I want to create cloumns of 72/3 ie 24% width.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You need to set a width to the parent. Whether that’s 100% or a pixel width otherwise the engine doesn’t know what to derive the % from.

    also you should explain what your code is doing and what you want it to do better so that more people can help and you don’t get down votes 🙂

    edit

    also considering what you’re showing here you probably are ending up with children going outside of the INNER parent. I would add a clearfix to your stylesheets just google clearfix and you should be good to go. Basically it adds a pseudo element to the end of the parent, clears that element, which gives a context so your children play nicely.

    • 0