13/32


#1

Помощь в прохождении испытания-ПАЗЗЛ
Ребята помогите, что не так? не получается сдвинуть фиолетовый квадрат.


#2

Покажите, что уже сделали сами.


#3

выше,спасибо


#4

Здесь от положения одного блока зависит положение остальных.
И то, что визуально кажется, что осталось только исправить положение одного блока, в итоге меняет порядок почти всех.
Попробуйте начать сначала. Помните о подсказке в теории, что для того, чтобы возле фиолетового блока (без свойства float) были флоатные, то нужно ставить их выше по порядку.
Также вы можете выписать на листок названия блоков и их соответствующий цвет или помечать их с помощью комментария в коде, чтобы не запутаться.
Например, блок1 - “голубой вертикальный”.


#6

получилось)


#7

И у меня получилось. Ineska, спасибо за совет писать комментарий возле блока :smiley:


#8

ну допустим написать комментарий какого цвета и расположения блок первое что мне пришло в голову - но дальше…или я ничего вобще не усвоила из пройденного материала или здесь все методом тыка делалось


#9

Перепройти тему заново, если не помогает, найти еще материалы в свободном доступе. Бывает, что для понимания нужно другое изложение материала. Всё в ваших руках - это же самообразование.


#10

забавно, что в задании нет ни одного горизонтального красного блока и ни одного вертикального зеленого.


#11

Хоть убей-не понимаю,почему зеленый блок не встает в паз,ему же достаточно места, и в ряд их можно выстраивать,на примере верхних 3-х блоков,где 2 из них обтекают справа,а тут не обтекают справа…
П.с. задачу решил.

<html>
    <head>
       <title>Испытание: пазл на флоатах</title>
       <meta charset="utf-8">
    </head>
    <body>
        <div class="puzzle">
            <div class="block5"></div>
            <div class="block7"></div>
            <div class="block3"></div>
            <div class="block1"></div>
            <div class="block6"></div>
            <div class="block5"></div>
            <div class="block7"></div>
            <div class="block2"></div>
        </div>
    </body>
</html>

#12

тут у вас два 5-х блока и нет 4-го


#13

Да,вот я и спрашиваю,почему с 4 блоком работает,а 5 нет.


#14

у 4 и 5 разный флоат, + тут два 7-х блока, надо использовать 1-8 блоки, решение есть и даже 2 варианта как мне показалось из форума в итоге


#15

У меня так тоже получилось :slight_smile:


#16

начинать надо с верхних правых флоатов))


#17

с таким же кодом получается куча разбросанных кубов


#19
<!DOCTYPE html>
<html>
    <head>
       <title>Испытание: пазл на флоатах</title>
       <meta charset="utf-8">
    </head>
    <body>
        <div class="puzzle">
           <div class="block5"></div>
            <div class="block7"></div>
            <div class="block3"></div>
            <div class="block1"></div>
            <div class="block6"></div>
            <div class="block5"></div>
            <div class="block7"></div>
            <div class="block2"></div>
        </div>
    </body>
</html>

#20

А так можно или читерство? ))

<body>
        <div class="puzzle">
            <div class="block3" style="float:left"></div>
            <div class="block8"></div>
            <div class="block5"></div>
            <div class="block6"></div>
            <div class="block1"></div>
            <div class="block4"></div>
            <div class="block7"></div>
            <div class="block2"></div>
        </div>
    </body>

#21

Нельзя.


#22

У меня не выходила первая линия, оказывается перепутал зеленый горизонтальный прямоугольник местами с нижним на своем чертеже с флоатами на право и влево.