Home/ Questions/Q 8083791
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-05T17:35:16+00:00

I got 3 divs that: need to to be side by side ( in

  • 0

I got 3 divs that:

  • need to to be side by side ( in a row)
  • all have a background imgage
  • the center div need to adjust the width automatic, center div’s width dependance on the content that have been inserted into the div( longer text = longer width
  • center div needs to be at the center of the page too.
  • the divs on sides have diffrent backgrounds img.

HTML Code:

<div class="spanl"></div>
<div class="center">Headline</div>
<div class="spanr"></div>

note that the divs in sides are empty.

something like this:
http://jsfiddle.net/fsnuh/134/

Is this possible to do with css or css3? If not how can I do it with jquery or raw javascript?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Tables for the win! fiddle 

    <!DOCTYPE html>
<html>
    <head>
        <style type="text/css">
            #container {  display: table; width: 100% }
            #left, #right { display: table-cell; width: 50%; background: #ffd }
            #content { display: table-cell }
        </style>
    </head>
    <body>
        <div id="container">
            <div id="left"></div>
            <div id="content">
                <div style="white-space: nowrap" onclick="this.firstChild.nodeValue += ' blah'">blah</div>
            </div>
            <div id="right"></div>
        </div>
    </body>
</html>
    • 0