Перейти к содержанию
norfnorf2

Поехал Breadcumb (Хлебные крошки)

Рекомендуемые сообщения

Приветствую, формчане!

 

Во-первых, спасибо всем огромное за то, что делитесь своими знаниями - выручили уже сотню раз. 

 

Столкнулся с проблемой, и не нашел ответа пока здесь:

 

Вылез за  свою границу путь к товару и залез на название - смотрится отвратительно. Скрин прилагаю.

post-709749-0-79518500-1461379882_thumb.jpg

 

Как бы мне растянуть Breadcumb так, чтобы путь к товару, умещающийся в двух строчках отображался корректно?

 

Сразу оговорюсь - знания нулевые. Однако, уверен, что с внятными рекомендациями способен внести нужные правки в код.

 

ocStore 1.5.5.1.2 без дополнительных модулей.

 

Заранее всем спасибо!

 

 

 

 

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

без ссылки бесполезно справшивать

 

хотя 90% дело в position:absolute

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

У вас огромный путь в бредкрумбе стоит, а в css маленькая высота

Вот Ваш код css  - catalog/view/theme/default/stylesheet/stylesheet.css в строке 405

.breadcrumb {
    background: transparent url("../image/background.png") repeat-x scroll 0 0;
    border: 1px solid #dbdee1;
    border-radius: 7px 7px 0 0;
    color: #cccccc;
    height: 30px;
    line-height: 30px;
    margin-bottom: 10px;
    padding-left: 10px;
}

Можете поиграться с height и line-height до того момента, пока не начнет нравится, но учитывайте, что есть еще и background (задает фоновую картинку, в Вашем случае высотой 30px) - играйтесь.

Изменено пользователем hoolygan
  • +1 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

У вас огромный путь в бредкрумбе стоит, а в css маленькая высота

Вот Ваш код css  - catalog/view/theme/default/stylesheet/stylesheet.css в строке 405

.breadcrumb {
    background: transparent url("../image/background.png") repeat-x scroll 0 0;
    border: 1px solid #dbdee1;
    border-radius: 7px 7px 0 0;
    color: #cccccc;
    height: 30px;
    line-height: 30px;
    margin-bottom: 10px;
    padding-left: 10px;
}

Можете поиграться с height и line-height до того момента, пока не начнет нравится, но учитывайте, что есть еще и background (задает фоновую картинку, в Вашем случае высотой 30px) - играйтесь.

Благодарю! Все помогло. Расширил вниз и увеличил картинку бэкграунда.. Конечно, было бы идеально, если бы бэкграунд был адаптивным, т.е. растягивался вниз, когда появляется вторая строка. Но это уже близко к идеалу.

 

ЗЫ не знаю, как тут лайкнуть, не вижу кнопки.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

У бекграунда есть свойство repeat, может как по вертикали, так и по горизонтали работать. Играйтесь )

  • +1 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Измените CSS

.breadcrumb {
    background: url('../image/background.png') repeat transparent;
    border: 1px solid #DBDEE1;
    -webkit-border-radius: 7px 7px 7px 7px;
    -moz-border-radius: 7px 7px 7px 7px;
    -khtml-border-radius: 7px 7px 7px 7px;
    border-radius: 7px 7px 7px 7px;
    color: #CCCCCC;

    min-height: 30px;
    line-height: 30px;
    margin-bottom: 10px;
    padding-left: 10px;
}

Изменено пользователем Shureg

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.