views:

53

answers:

2

Hello,

I have a indefinite amount of in-line elements being output. Now, depending on browser width, some elements will, of course, wrap to a new line. Is it possible to detect and single out these rows of elements or does the dom just see it as one large line?

Thanks for the help!!

EDIT: Trying to detect wrapped elements via offset height(Thanks Matchu). Wrapped elements output same values(total height of the element) as those found on the first row though. Any reason why?

$('#content').children().each(function() {
       alert($(this)[0].offsetHeight); 
    });
+4  A: 

You can check the offsetHeight property of the elements and watch for it to jump. When an inline element has a greater offsetHeight than the previous element, this element is on a new line.

Matchu
Very clever! I just tried it though and it didn't work. I am getting the same values on the second row that i do in the first. I added the jquery code i'm using to get offsetheight in my question above..
Works for me: http://jsbin.com/awago3/edit - Since you're using jQuery, I did, too.
Matchu
I used .offset().top like you did in your example and now it works for me as well! Thanks for all the help!
A: 

No, it's not possible directly. You could only try to measure the width of each element, compute the position and process the ones that don't fit.

Kerido