Layout страницы за 5 секунд

[So1]

Надо было написать «Интриги, скандалы, расследования! Шок — Layout за 5 секунд или как сдать проект еще до того, как заказчик приступил к переговорам».

Извините, но подобные заголовки правда надоели. И ладно где-нибудь, но на хабре…

К слову сказать, проект-то хороший — молодцы.

[Vovanys]

Спасибо, пригодится!

[Tishka17]

Полосы прокрутки так и задуманы? Opera 11.52, kubuntu 11.10

[gipoz]

Полос прокрутки быть не должно. Спасибо за ответ. По тестируем в opere.

[Astramak]

Что сделаете?

[ComodoHacker]

Тестируют свое ПО в Опере

[skorney]

У меня в Chromium прокрутки, а в Firefox нет. Ubuntu 11.10.

[Sytrus]

Автор, поправьте здесь:

.content {
	min-height: 100%;
	position: relative;
	/*overflow: auto;*/
	z-index: 0; 
}

чтобы люди не жаловались. Полагаю, причина в этом.

[retran]

Спасибо, добавил в свой список инструментов.

[Kislov]

Я бы оффлайн версию купил даже, хороший сервис!

[l1bbcsg]

А зачем в каждый сгенерированный див вставляется ещё один div.content? И зачем добавлять в классы ему и создаваемому блоку то что указано в title..?

По интерфейсу, как-то совсем не удобно создавать блок, потом в контекстном меню его прикреплять, потом в другом меню задавать параметры, по-моему формы стоило бы объединить.

Неплохо было бы добавить отдельными пунктами популярные шаблоны, что-то типа создания таких лейаутов в один клик, или просто популярные элементы: Хэдер, подвал, колонка слева/справа, итд…

В опере кнопки контекстного меню (те что с шестерёнками) перекрывают собой сами меню, но это видимо проблема jQuery UI.

[gipoz]

Каждый блок может быть со своими стилями(backround, padding, border), поэтому есть общий класс и отдельный класс для настройки каждого блока.
Интерфейс — это не конечная версия. Да много не удобно, но в целом пользоваться можно. Если будет большой интерес к проекту — тогда сделаем более продвинутый продукт.
По поводу популярных шаблонов в ближайшее время выложим. Это действительно нужно. Так же думаем снять видео по созданию наиболее популярных лейаутов.
В опере будем дополнительно тестировать.
Спасибо за отзыв.

[Neiro]

как же я вас ждал))) спасибо!
P.S. я не веб-кодер, но иногда пишу для души и для работы.

[Zverik]

Три секунды грузилась страница, ещё двадцать я втыкал в надпись body и искал, куда бы нажать. Заголовок неверен.

[gipoz]

Ну как-бы "Мануал для любителей почитать." присутствует в статье.

[Sytrus]

Краткий мануальчик могли бы и сюда выложить.

[mongoose]

.меню {
	width: 100%;
	height: 235px;
	background-color: #999966;
}

транслит при генерации стилей не помешал бы.

[torbasow]

А зачем?

[chuvak]

и еще такой вот неприятный момент с менюшкой

[l1bbcsg]

Во, я как раз об этом говорил, в опере так-же, просто не решился говорить за все браузеры не потестив.

P.S. Подскажите пожалуйста, что за таскбар у вас.

[chuvak]

это awesome тайловый wm

[gipoz]

Спасибо за отзыв. Будем продолжать дорабатывать.

[fear86]

Интересно, но быстрее весь этот html в IDE набросать. Что там сложного? Вставить 5 дивов, по секунде на каждый ctr+v? Стили то все равно, придется самому писать.

[gipoz]

У нас генерируется и html и все стили. Самому ничего писать не нужно. Только скопировать.

[fear86]

Ну допиливать стили то потом все равно надо, но для не про пойдет. А базовый набор шаблонов имеют по моему многие CSS фреймверки, и верстальщики =). Единственное что бы я посоветовал, это наборы типовых шаблонов. Ну и в свете популярности CSS фреймверков, возможно выбор кого то из них как базового. Ну и надо расширять функциональность. Например попробовать сделать сетку, что бы удобнее менять размер блоков, и велечины были кратные 5 и 10 ну или заданному размеру ячейки сетки.

В общем идею можно развить не плохо.

[fear86]

Еще как вариант подключить 690 grid system

[Fesor]

Забавно, буквально неделю назад писал похожую систему, но там все было основано на drag n drop. Тобиш по аналогии с Qt Creator и подобными. Вертикальные/горизонтальные лэйауты, сетка, виджеты. Нужно было для проекта, где все страницы представляют из себя конструктор. Но все же не могу придумать где можно использовать водобное. Для непосредственно верстки — ХЗ, простенький сайт-визитку сделать таким образом можно, но все же…
Отсюда вопрос — где могут найти применение подобные штуковины? Прибить футер/хэдер/сайдбар — дело минутное, и почти у всех есть какие-то стандартные макеты. Может дело и облегчает, но мне интересно в плане реализации продукта.

[gipoz]

Баг. Поправим

[GoldenAlex]

То что надо, теперь на живых примерах буду учиться как же ставить по разному блоки используя CSS! Для меня, как начинающего очень даже суперский инструмент, спасибо.

[shoorick]

Было бы удобно, если бы рядом с просмотром результата была ссылка «Скачать архив», а по ней — отдавать архив (zip?) с HTML- и CSS-файлами.

[gipoz]

Да. Данная функциональность будет реализована в ближайшее время.

[hoy]

не сообразил как сделать float

[gipoz]

Для чего необходимо сделать float?

[AInside]

Забиваю padding и margin для блока, но никакого эффекта это не дает. Потом снова открываю свойства блока, а там пусто. Этот функционал еще не работает?

[gipoz]

Этот функционал будет реализован.

[stanlee]

по моему, нужно раздел треша замутить, эта тема как раз для него

[fatal]

По-моему — супер получилось, даже в первой версии!

У меня давно (уже лет пять как) была идея создать что-то подобное, но времени как всегда не было. Только у меня идея была в упрощения работы с содержимым: очень хотелось ускорить создание набросков больших веб форм, путём создания (копирования) и свободного перетаскивания отдельных кусочков информации.

Буду пристально следить за проектом. Спасибо за полезную разработку.

[fatal]

Что-то надо делать с управлением блоками. Блок-контейнер легко перекрыть другими блоками, и потом до него не добраться.

[RubyRoid07]

Я почему-то не могу задать ни margin ни padding никакого блока.
Пробовал задавать просто: 60px.
Пробовал с пробелом: 60 px.
Пробовал без указания единиц: 60.
Пробовал в разнообразных комбинациях вроде 60 60 60 60 или 60px 60px 60px 60px.
Ни один из вариантов не сработал, если открыть свойства блока заново, то в свойствах margin и padding пусто.
Не подскажете, что я делаю не так?