Расположение div рядом друг с другом

Question

Я пытаюсь создать очень простой слайдер jQuery; однако, чтобы начать, я хотел расположить свои div'ы рядом друг с другом, а не под друг другом, чтобы я мог анимировать значение css: left:. Я тупой и совершенно не в этом, хотя. Я не понимаю

Вот пример кода, с которым я играю:

http://jsfiddle.net/YUQWx/1/

Я не понимаю, почему они остаются ниже друг друга вместо того, чтобы идти рядом друг с другом. left: кажется игнорируется? Я, наверное, что-то упускаю здесь.

Заранее спасибо.

Answer 1

Вы пишете .scrolling-content с чертой в CSS, но с подчеркиванием (<div id="zone_a" class="scrolling_content">) в HTML.Исправьте орфографию, и все будет в порядке: -)

Answer 2

Вам нужно пропустить div. Что-то вроде:

#div1 { 
    float: left;
    width: 200px;
}

#div2{ 
    float:left;
    width:200px;
}

Answer 3

Вы пробовали float: left;.Измените следующее:

#scrollzone
{
    width: 700px;
    height: 200px;
    position: relative;
    float: left;    
}

#zone_a, #zone_b, #zone_c
{
    width: 300px;
    float: left;
    height: 200px;    
    top: 0px;
}