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

[norfnorf2]

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

 

 

 

 

[Otvet]

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

 

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

[norfnorf2]

cy30509.tmweb.ru/

[hoolygan]

У вас огромный путь в бредкрумбе стоит, а в 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) - играйтесь.

Змінено 23 квітня 2016 користувачем hoolygan

[norfnorf2]

У вас огромный путь в бредкрумбе стоит, а в 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]

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

[Shureg]

Измените 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;
}

Змінено 24 квітня 2016 користувачем Shureg