Как прижать картинку к правому краю и чтобы по ней измерялась высота всего блока?
Вставляю картинку и придаю ей значение float: right; и она у меня уходит вниз(см 1 картинку). Как сделать чтобы она равнялась по центру и по ней вычислялась высота блока(см 2 картинку)
(1 картинка) 
(2 картинка)
Как сделать, чтобы фотография располагалась по правому краю окна браузера?
Разместить фотографию по правому краю окна браузера, чтобы близлежащий текст обтекал её с других сторон.
Решение
По умолчанию, изображение на странице располагается по левому краю окна браузера, а близлежащий текст выравнивается по нижней кромке изображения. Чтобы задать выравнивание по правому краю для селектора IMG следует установить стилевое свойство float со значением right .
Не все рисунки на странице следует выравнивать указанным образом, поэтому лучше ввести специальный класс, назовем его rightpic , и будем добавлять его только к нужным изображениям. Также вокруг рисунка желательно добавить отступы через свойство margin , чтобы между текстом и изображением появилось пустое пространство (пример 1).
Пример 1. Изображение по правому краю
HTML5 CSS 2.1 IE Cr Op Sa Fx
Результат данного примера показан на рис. 1.
Рис. 1. Фотография, выровненная по правому краю
Свойство float не только выравнивает элемент по правому или левому краю, но одновременно устанавливает вокруг элемента обтекание. При этом другие объекты, например текст, плотно к нему прилегают. Это легко избежать, если воспользоваться универсальным свойством margin , которое одновременно задаёт отступ сверху, справа, снизу и слева от изображения.
Выравнивание по правому краю | CSS
Длинный абзац с несколькими предложениями. 
Он содержит текст, характеризующий помеченное флажком свойство, и изображение, которое нужно прижать к краю правой стороны.
Свойство text-align наследуется, применяется к блочным элементам.
Выравнивает все содержащиеся в них строчные элементы и текст по горизонтали. Оно не перемещает сам элемент и не передвигает блоки, не работает, если задано строчному элементу. У него есть несколько значений, в том числе right , позволяющих сдвигать содержимое вправо.
Свойство margin-left не наследуется, применяется ко всем элементам. У него есть значение auto , которое выравнивает блочный элемент по горизонтали. А именно margin-left: auto; прижимает элемент к правому краю родителя. Это положение может изменяться свойством margin-right . При margin-left: auto; и margin-right: auto; элемент размещается по центру ширины предка.
Свойство float не наследуется, применяется ко всем элементам. Оно вынимает элемент из потока и прижимает к краю левой или правой стороны родителя. Элементы и текст, расположенные в коде после float-элемента, обтекают его с противоположной стороны.
Свойство position не наследуется, применяется ко всем элементам. position: absolute; вынимает элемент из потока и располагает поверх остального содержимого. Его можно перемещать относительно границ родителя, у которого значение position отлично от static , с помощью свойств top , right , bottom , left . При direction: ltr; свойство left имеет приоритет над свойством right , кроме случаев, когда свойство left имеет значение auto .
Выравнивание и создание плавающих изображений с помощью CSS
С помощью align html изображения могут быть расположены и выровнены так, что будут находиться в определенном месте на странице. То, как вы хотите отобразить изображение, определяет, будете ли вы выравнивать изображение или сделаете его плавающим.
Выровненные изображения не обтекаются текстом вокруг них. Выравнивание будет размещать изображение слева, справа или по центру, а текст будет расположен до и после изображения. Выравнивание оставляет немного пустого места на сайте.
Плавающее изображение позволяет тексту обтекать себя, как в обычной книге или газете. Изображения могут быть размещены горизонтально. Это удобно для отображения изображений в виде галереи. Далее показано, как выравнивать и делать изображения плавающими с помощью CSS .
Выравнивание слева, справа и по центру
Изображения могут быть выровнены слева, справа и по центру с помощью тега div и встроенного стиля CSS . Текст не обтекает изображения, для контейнеров которых применено свойство HTML text align .