Форум PHP программистов > Не могу исправить ошибку.

[ Поиск ] - [ Пользователи ] - [ Календарь ]

Полная Версия: Не могу исправить ошибку.

Страницы: 1, 2

Ramzil_Nixon

29.03.2014 - 19:12

Привет всем!

В ходе работы столкнулся со следующей проблемой:

user posted image

Список выводить в виде блогов. Блоги создал с помощью float.
Так вот объект стоит не там, где должна быть (красная стрелка показывает место где должна быть).

И все это из-за длинного текста (синяя стрелка). Как это можно исправить? Можно ли как нибудь часть текста спрятать под блоком? Или как еще можно это исправить?

Ширина столбца на котором размещены эти блоги 780px.

.FilmBlock { width: 195px;
			 max-width: 195px;
			 min-width: 195px;
			 float: left;
			 text-align: center;
			 margin-bottom: 15px;
			 margin-top: 5px; }

<div class="FilmBlock">
    <img src="Ссылка на постер" width="150">
        <br>
        <a href="" class="LinkStandart">Название</a>
        <br>
        <b>Год выпуска</b>
</div>

_____________
Миллионы приходят, уходят, не в них счастье. Самым важным на свете всегда будут люди в этой комнате, вот здесь, сейчас...

user posted image

sergeiss

29.03.2014 - 19:13

Ты бы еще мельче картинку сделал

Выехавший блок видно, а вот насчет текста не понятно.

А еще лучше - покажи свою разметку.

_____________
* Хэлп по PHP
* Описалово по JavaScript
* Хэлп и СУБД для PostgreSQL

* Обучаю PHP, JS, вёрстке. Интерактивно и качественно. За разумные деньги.

* "накапливаю умение телепатии" (С) и "гуглю за ваш счет" (С)

Ramzil_Nixon

29.03.2014 - 19:14

sergeiss, Теперь все, картинка нормальная

sergeiss

29.03.2014 - 19:19

Не видя твою разметку, ничего не скажешь. Только предположить можно. "Гадать на кофейной гуще" можно, но не нужно.
Короче говоря, показывай свою разметку, уже с ней будем думать.

_____________
* Хэлп по PHP
* Описалово по JavaScript
* Хэлп и СУБД для PostgreSQL

* Обучаю PHP, JS, вёрстке. Интерактивно и качественно. За разумные деньги.

* "накапливаю умение телепатии" (С) и "гуглю за ваш счет" (С)

Ramzil_Nixon

29.03.2014 - 19:22

sergeiss, Совсем забыл про разметку.

Ширина столбца на котором размещены эти блоги 780px.

.FilmBlock { width: 195px;
			 max-width: 195px;
			 min-width: 195px;
			 float: left;
			 text-align: center;
			 margin-bottom: 15px;
			 margin-top: 5px; }

sergeiss

29.03.2014 - 19:25

Это ты показал стиль "непоймичего". А ты покажи тэги! ДИВы и всё остальное. Что у тебя входит в один блок.

_____________
* Хэлп по PHP
* Описалово по JavaScript
* Хэлп и СУБД для PostgreSQL

* Обучаю PHP, JS, вёрстке. Интерактивно и качественно. За разумные деньги.

* "накапливаю умение телепатии" (С) и "гуглю за ваш счет" (С)

Ramzil_Nixon

29.03.2014 - 19:28

sergeiss, конечно. Вот:

<div class="FilmBlock">
    <img src="Ссылка на постер" width="150">
        <br>
        <a href="" class="LinkStandart">Название</a>
        <br>
        <b>Год выпуска</b>
</div>

sergeiss

29.03.2014 - 19:39

Ну, в целом правильно, вроде как... Попробуй еще жестко установить высоту блока (для этого же класса FilmBlock). И, на всякий случай, "overflow: hidden"
И вот это я не понял:

 max-width: 195px;
 min-width: 195px;

У тебя же уже жестко установлена ширина, она не может меняться.

_____________
* Хэлп по PHP
* Описалово по JavaScript
* Хэлп и СУБД для PostgreSQL

* Обучаю PHP, JS, вёрстке. Интерактивно и качественно. За разумные деньги.

* "накапливаю умение телепатии" (С) и "гуглю за ваш счет" (С)

Ramzil_Nixon

29.03.2014 - 19:48

Цитата (sergeiss @ 29.03.2014 - 15:39)

"overflow: hidden"

Пробовал уже, не помогает.

Цитата (sergeiss @ 29.03.2014 - 15:39)

У тебя же уже жестко установлена ширина, она не может меняться.

Вот это и я не могу понять.

Цитата (sergeiss @ 29.03.2014 - 15:39)

жестко установить высоту блока (для этого же класса FilmBlock)

А вот это щас попробую

_____________
Миллионы приходят, уходят, не в них счастье. Самым важным на свете всегда будут люди в этой комнате, вот здесь, сейчас...

user posted image

Ramzil_Nixon

29.03.2014 - 19:56

Цитата (sergeiss @ 29.03.2014 - 15:39)

Попробуй еще жестко установить высоту блока

Помог, спасибо.

_____________
Миллионы приходят, уходят, не в них счастье. Самым важным на свете всегда будут люди в этой комнате, вот здесь, сейчас...

user posted image

YVSIK

29.03.2014 - 23:08

Цитата (Ramzil_Nixon @ 29.03.2014 - 19:12)

Можно ли как нибудь часть текста спрятать под блоком? Или как еще можно это исправить?

даже не смотрел на твои разметки.
все что пришло
например: может и сложновато будер но работать будет
берем картинку и текст разделяем по дивам/правда на ум приходит запутаться можно. но всеже/
ещё ра
разделяем в одном общем диве где и картинка и текс вместе
общий див и в нем ещё два,
один для картинки, второй для текста
теперь задает размер для кртинки /картинка скажем 150 px, значит див 150px
второй той-же штрины НО!
если применить марнинги минусовые
пример вот отсюда просмотр как код/смотри как выравнен Велком от главного дива

margin-left: -179px;

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

margin-right: 179px;

ну а текст внутренними отступами выравнивай
padding-left: 79px;

что будет в результате див прежний, а вот размер текста в нем будет вылазить поверх его
картинки не пострадают :)

_____________
«Гнусное свойство карликовых умов приписывать
________________!свое духовное убожество другим!»
___О) как-же он прав=>__________________ © Оноре де Бальзак.
отличный хост(рекомендую !! )
My MVC-CMV

TMake

29.03.2014 - 23:26

Ramzil_Nixon посмотри в сторону display: inline-block; за места float, а блоки сделай через <ul> <li>
для примера http://learn.javascript.ru/task/raznica-inline-block-i-float

Zzepish

29.03.2014 - 23:32

Я бы запилил через таблицу и не парил мозг

TMake

29.03.2014 - 23:34

Цитата (Zzepish @ 29.03.2014 - 23:32)

Я бы запилил через таблицу и не парил мозг

ну и зря

sergeiss

29.03.2014 - 23:36

Цитата (Zzepish @ 29.03.2014 - 23:32)

Я бы запилил через таблицу и не парил мозг

Таблица тут не годится. Потому что там не будет динамически меняться количество элементов в строке.

_____________
* Хэлп по PHP
* Описалово по JavaScript
* Хэлп и СУБД для PostgreSQL

* Обучаю PHP, JS, вёрстке. Интерактивно и качественно. За разумные деньги.

* "накапливаю умение телепатии" (С) и "гуглю за ваш счет" (С)

Быстрый ответ:

Здесь расположена полная версия этой страницы.