dkameleon: зависит от того на сколько он произвольный. Если уж слишком произвольный, то похоже решение отсутствует. по крайней мере в блочном варианте.
Допустим, он изначально представлен в виде BBCODE-разметки, допустимой на этом форуме + [H]Подзаголовок[/H]. Но при преобразовании в HTML должно выполняться условие: подзаголовки не должны обтекать картинки, даже если у картинок стоит обтекание (то есть если бы не было врезки, то 100% верным решением было бы просто clear:both у подзаглововков). Врезка все портит
dkameleon: например, если внутри блока есть картинка, то блоку делать display:table;
вся сложность в том, чтобы разбить на блоки, т.к. html произвольный в самом общем случае. Блок собственно может и не быть оформлен в блок. Это может быть просто текст со вставленными подзаголовками. Ну и display:table не совсем гуд из-за эффекта вытянутого последнего блока.
dkameleon: Есть вариант, не требующий особых знаний ХТМЛ от наполнителя, но только один блок, который частично перекрывает низ врезки, не обтекает её.
В этом случае (если я все правильно понял), достаточно принудительно сделать врезку чуть больше по высоте + прозрачный низ. Какова реализация?
Как вариант, можно попробовать решать задачу автоматически яваскриптом.
сейчас как раз думаю именно над этим вариантом
dkameleon: В общем clear:both; можно заменить на display:table; для блока, в котором лежит картинка и текст абзаца. Последующий заголовок будет идти ниже, не обтекая картинку, но это нарушит обтекание текста вокруг врезки.
щас пойду почитаю отличие display:block от display:table. Но что-то мне подсказывает, что в данном случае разницы не будет
Ткач: psylosss, если картинки одинаковые по высоте, то можно задавать блоку в котором они минимальный экспрешн, тогда заголовок будет всегда под картинкой
Стоит увеличить ширину статьи, и получаем ошибку. То же самое, если увеличить объем первого абзаца - он не будет обтекать статью.
Ткач: psylosss, удаляем clear: both получаем
При уменьшении объема 2 абзаца получаем ошибку: подзаголовок не обтекает врезку.
Туго идет 🚬 я на эту задачу тоже немало времени потратил :)
Есть свежие идеи? Возможно, JS подключить? :)
psylosss добавил 05.07.2008 в 14:51
psylosss: кто наполнять будет, тот просто должен знать html, чтобы в зависимости от высоты врезки, выравнивания картинок и т.д., чтобы было красиво - редактировать стиль.
Не катит. Врезка динамическая, как и текст. Слишком серьезное ограничение. К тому же ширина экрана и т.п....
Ткач: psylosss, что там не так? там где вставляется картинка, она с текстом будет идти в отдльном блоке, врезка одна или их тоже много будет? картинка может выравниваться как по правому так и полевому краю, не понятно в чем проблема остается
Вот контрпример. Ошибка: заголовок обтекает вторую картинку, выровненную по правому краю, а не должен.
зависит от того на сколько он произвольный.
Если уж слишком произвольный, то похоже решение отсутствует. по крайней мере в блочном варианте.
Допустим, он изначально представлен в виде BBCODE-разметки, допустимой на этом форуме + [H]Подзаголовок[/H]. Но при преобразовании в HTML должно выполняться условие: подзаголовки не должны обтекать картинки, даже если у картинок стоит обтекание (то есть если бы не было врезки, то 100% верным решением было бы просто clear:both у подзаглововков). Врезка все портит
например, если внутри блока есть картинка, то блоку делать display:table;
вся сложность в том, чтобы разбить на блоки, т.к. html произвольный в самом общем случае. Блок собственно может и не быть оформлен в блок. Это может быть просто текст со вставленными подзаголовками. Ну и display:table не совсем гуд из-за эффекта вытянутого последнего блока.
dkameleon, уже что-то.. Но тоже косяки есть.
В первом варианте - последний из необтекающих абзацев не обтекает, а идет с фиксированной шириной вниз (из-за display:table)
Во втором варианте - первый абзац тянет за собой по высоте всю врезку, не обтекая ее.
Все-таки думаю в сторону яваскрипта, но пока толком не могу придумать алгоритм отрисовки
выбирайте:
1. <meta refresh>
2. file_put_contents
Есть вариант, не требующий особых знаний ХТМЛ от наполнителя, но только один блок, который частично перекрывает низ врезки, не обтекает её.
В этом случае (если я все правильно понял), достаточно принудительно сделать врезку чуть больше по высоте + прозрачный низ. Какова реализация?
сейчас как раз думаю именно над этим вариантом
В общем clear:both; можно заменить на display:table; для блока, в котором лежит картинка и текст абзаца.
Последующий заголовок будет идти ниже, не обтекая картинку, но это нарушит обтекание текста вокруг врезки.
щас пойду почитаю отличие display:block от display:table. Но что-то мне подсказывает, что в данном случае разницы не будет
psylosss, если картинки одинаковые по высоте, то можно задавать блоку в котором они минимальный экспрешн, тогда заголовок будет всегда под картинкой
увы :( картинки тоже произвольные...
Тогда так возможно.
Стоит увеличить ширину статьи, и получаем ошибку. То же самое, если увеличить объем первого абзаца - он не будет обтекать статью.
psylosss, удаляем clear: both
получаем
При уменьшении объема 2 абзаца получаем ошибку: подзаголовок не обтекает врезку.
Туго идет 🚬 я на эту задачу тоже немало времени потратил :)
Есть свежие идеи? Возможно, JS подключить? :)
psylosss добавил 05.07.2008 в 14:51
кто наполнять будет, тот просто должен знать html, чтобы в зависимости от высоты врезки, выравнивания картинок и т.д., чтобы было красиво - редактировать стиль.
Не катит. Врезка динамическая, как и текст. Слишком серьезное ограничение. К тому же ширина экрана и т.п....
psylosss, выравнивание редактировать надо просто
вот например
Вот ваш пример при высокой врезке. Ошибка: статья не обтекает врезку, начиная со второго абзаца.
psylosss, что там не так?
там где вставляется картинка, она с текстом будет идти в отдльном блоке, врезка одна или их тоже много будет?
картинка может выравниваться как по правому так и полевому краю, не понятно в чем проблема остается
Вот контрпример. Ошибка: заголовок обтекает вторую картинку, выровненную по правому краю, а не должен.
Не соответствует: если картинок в одном абзаце несколько и они выровнены как по левому, так и по правому краю?
или я не понимаю каким должен быть дизайн
см. п.1
Сейчас смастерю более наглядный пример.