[css] Too long breadcrumb menu when I have to make a long name of post's subject



태그: 

4 글 보임 - 1 에서 4 까지 (총 4 중에서)
  • 글쓴이
  • #4525
    Javert Matthew
    참가자

    Merry Christmas or Holiday!
    I have installed Breadcrumb NavXT so that to make a breadcrumb menu like a demo performance in your home.
    But it’s too long breadcrumb menu when I sometimes have to make a long length of post subject/name.
    How can I control/cut a subject length of my posting off in breadcrumb menu?
    or Can I remove the posting subject in breadcrumb menu if I can’t control?
    I can’t control in the control panel of the Extension.
    Can I get any way for this?
    Thank you.

    #4526
    mimoon12
    키 마스터

    Please add below custom css code to hide the long text.

    .breadcrumb {
    max-width: 370px;
    height: 20px;
    text-overflow: ellipsis;
    white-space: nowrap;
    }
    #4527
    Javert Matthew
    참가자

    Thank you for your suggestion.
    That code is helpful.
    But Plz allow one more question about this.

    I have any suggestion from mtekk.com.

    .breadcrumbs span[property="name"] {
        max-width: 320px;
        display: inline-block;
        padding: 0;
        margin-top: -3px;
        vertical-align: middle;
        max-width: 20px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    It may be control in ‘posting subject’.
    Because span[property=”name”] is a tag for the subject of each posting on Breadcrumb NavXT.
    But that code(mtekk’s) has no effect anything in this theme.
    So I changed as follows:

    .breadcrumb {
        max-width: 320px;
        display: inline-block;
        padding: 0;
        margin-top: -3px;
        vertical-align: middle;
        max-width: 20px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    I could get the effect that is same of your suggestion.
    Can I however get an effect for span[property=”name”] ?
    Finally, I want to remove ‘posting subject’ in breadcrumb menu-line by that code.

    #4528
    mimoon12
    키 마스터

    It’s the best setting for this issue if we no were find the way that removed only posting subject.

    .breadcrumb {
        max-width: 220px;
      //  display: inline-block; // ---except for mobile view
        padding: 0;
        margin-top: -3px;
        vertical-align: middle;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
4 글 보임 - 1 에서 4 까지 (총 4 중에서)
  • 답변은 로그인 후 가능합니다.