Добрый день!
Давным-давно здесь задавался
вопрос по выравниванию блогов по ширине.
Был предложен следующий вариант:
<style>
div.item {width: 250px; height: 150px; background: red; float: left;}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">
$(function ()
{
changeMargin();
});
$(window).resize(function()
{
changeMargin();
});
function changeMargin()
{
var container_width = $('div.container').width();
var item_width = $('div.item').width();
var items_count = Math.floor(container_width / item_width);
var items_width = item_width * items_count;
var difference = container_width - items_width;
var margin = difference / (items_count - 1);
$('div.item').each(function(index)
{
if (index > 0 && index % items_count != 0)
$(this).css('margin-left', margin+'px');
else
$(this).css('margin-left', '0px');
});
}
</script>
<div class="container">
<div class="item">1</div>
<div class="item">2</div>
<div class="item">3</div>
<div class="item">4</div>
<div class="item">5</div>
<div class="item">6</div>
<div class="item">7</div>
<div class="item">8</div>
</div>
Только вот всем левым блокам из данного решения не присваивается свойство
left-margin.
Как можно этого избежать?
