CODEWITHSUNDEEP
htmlcss
praks5432
praks5432

Reputation: 7772

Make parent element same width as child

So I have this sort of html

<div class="table-container">
  <input type="text" class="some-class"/>
  <table class="dataTable"/>

I want it so that the .some-class is always some percentage of the width of .dataTable(let's say 40%). I also want it so that if I append multiple table-containers(with the same children), that they appear below each other.

I've achieved the first requirement through the use of inline-block, but that means that these elements appear on the same line.

How do I achieve both?

JSFIDDLE- http://jsfiddle.net/9xR78/

Upvotes: 0

Views: 2795

Answers (2)

sangram parmar
sangram parmar

Reputation: 8726

try this

http://jsfiddle.net/9xR78/4/

.parent{
    background-color : red;
    display : inline-block;
    float:left;
    clear:both;
}

Upvotes: 1

omma2289
omma2289

Reputation: 54619

You could place a <br/> before each new .parent container

Example fiddle

Upvotes: 0

Related Questions