0

I'm looking for a short jQuery snippet to count how many divs I can have horizontally in my browser window. Basically, I'm using a fluid layout, like this:

<div id="wrapper">
    <div id="content">
        <div class="foo" />
        <div class="foo" />

Wrapper is 100% width, and foo about 250px wide. What's the simplest way to determine how many there can be in a single row? I prefer flexibility. If wrapper is changed to some fixed width in CSS, it should still work.

Edited by pritaeas

2
Contributors
2
Replies
3
Views
5 Years
Discussion Span
Last Post by pritaeas
0

Not sure maybe this could work

$(document).ready(function(){
  var $target = $(event.target);
  if ( $target.is("div").css('display','inline') ) {
    $(this).length
  }
});

Edited by pritaeas: Removed white space for readability

0

Found what I was looking for:

var count = Math.floor($('#wrapper').innerWidth() / $('.foo').outerWidth(true));

The true parameter for outerWidth takes the margin into consideration.

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.