Mike
Mike

Reputation: 3024

Weird positioning of elements when div contains text

I have this problem where I have some containers that need to be aligned in a parent container, but for some reason that does not happen.

This is how it looks like:

http://jsfiddle.net/pV6EV/1/

This is what happens if I remove the labels from top and bottom (removing this pieces of code <div class="eticheta">top</div> and <div class="eticheta">bottom</div>)

http://jsfiddle.net/pV6EV/2/

As you can see the div with class l34 is positioned correctly in the second example, but I need to have the labels inside it too.

Any advice would be great!

Upvotes: 0

Views: 73

Answers (3)

Arbaoui Mehdi
Arbaoui Mehdi

Reputation: 802

Try to replace:

.l31 {
  display: inline-block;
}

With:

.l31 {
  float:left;
}

Demo : http://jsfiddle.net/pV6EV/4/

Upvotes: 1

Hushme
Hushme

Reputation: 3144

its because you are using inline-block; in class that why element is not aligning properly just add vertical-align:top; in .134 class it will fix it

http://jsfiddle.net/pV6EV/5/

Upvotes: 3

yacon
yacon

Reputation: 1122

one thing I tried was changing the display property of l31 and l24. if you give them

display: block;
float: left;

it works for me.

Upvotes: 1

Related Questions