Убедитесь, что любой контент изменен в соответствии с фиксированным div

Question

Хорошо, вот в чем проблема: у меня есть div, который установлен почти на весь размер экрана (на мобильном устройстве), контент будет помещен в него, однако сам контент не находится под моим непосредственным контролем.Внутри изображений или ссылок внутри не будет встроенных стилей.Мне нужно убедиться в том, что:

1 - внутри div видно все, и если есть длинные строки, которые они вынуждены переносить или просто обрезают.

2 - изображения должнысохраняйте соотношение сторон, но изменяйте размеры, чтобы не выходить за рамки div.

3 - содержимое должно «заполнять» пространство, увеличиваясь или уменьшаясь по мере необходимости.

Последний бонус:В содержимом будет максимум ОДНО изображение, но может быть несколько ссылок.

Я нашел здесь несколько других ответов, но ничего, что могло бы удовлетворить эту конкретную проблему.

jQueryэто вариант, но я нашел его вялым на мобильных устройствах, jQuery Mobile - вариант, но та же самая основная проблема.

Какая наилучшая комбинация CSS и Javascript для выполнения этой задачи наиболее эффективным способом.

Answer 1

#wrapper {
 width: 960px;
 margin: 0 auto;
 overflow: hidden;
}

.img_class {
 height:auto;
 width:auto;
 max-width:960px;
}

/*If you have a div inside your wrapper then you would need this*/

#wrapper .contained_div {
 width: auto;
 display: inline-block:
 margin: 0;
}

/*If you want to stack stuffs one after another in a column then use this div */
.column {
 margin: 0 10px;
 overflow: hidden;
 float: left;
 display: inline;
}

Answer 2

Я не думаю, что вам понадобится любая форма JavaScript. Но без примера того, с чем вы работаете, это мое лучшее предположение:

#divId { height:auto; width:900px; white-space:normal; overflow:hidden; }
#divId img { height:auto!IMPORTANT; width:auto!IMPORTANT; max-width:900px; }

(замените мои значения ширины на ваши)

Это отформатирует текст так, чтобы он правильно отображался в div, но он может выглядеть как один фрагмент текста, но это может быть тем, что вы хотите. Если вы хотите отформатировать, вам придется использовать jQuery для поиска текста в div для определения разрывов строк и замены их на </p><br /><p> ... Просто добавьте открывающие и закрывающие теги Paragraph.