Blog Documentation Try Vanilla Cloud
Please upgrade here. These earlier versions are no longer being updated and have security issues.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.
Options

[Solved] Need more room for category lines

snootysnooty Florida ✭
edited May 2014 in Vanilla 2.0 - 2.8

This may be a modification question for my board. My category subject lines are a little too long, so on FF and Opera, it breaks with a space. IE renders it fine. Is there a way I can add a little more room for the long forum subjects on my general topic forum? See example (from Opera) below, notice how some of the longer forum subjects are "breaking" to the next line:

Comments

  • Options
    peregrineperegrine MVP
    edited May 2014

    increase the panel width or make the font smaller for the CategoriesBox

    e.g.

    #Panel { 
width: 250px;
}

    you may need to make content width smaller as well depending on how much you widen panel.

    or

.Box.BoxCategories {
    font-size: 10px;
}

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

  • Options
    snootysnooty Florida ✭
    edited May 2014

    Thanks peregrine. For some reason, its not breaking after I reloaded FF.
    Maybe I had the browser font at 125% Still is breaking in Opera, but I'm not too worried about that. Anyway, if I see it again, I will follow your suggestions.

    Where would I make those adjustments if I had to, in a CSS file? I know just enough coding to be dangerous...

  • Options
    vrijvlindervrijvlinder Papillon-Sauvage MVP
    edited May 2014

    You make these changes in the custom.css of the theme. If they don't exist in there just add them to the theme.

    this is the box that holds the list

    ul.PanelInfo.PanelCategories {
margin: 0;
width: 100%;
}

    this is each category row

    ul.PanelInfo.PanelCategories li{
margin: 0;
    width: 100%;
}

    this is the category link

    ul.PanelInfo.PanelCategories li a {
color: #c5bdd1;
font-size: 10pt;
font-weight: 700;
margin: 2px;
text-shadow: 1px 2px 0 #000;
}

    this is the count

       ul.PanelInfo.PanelCategories li a span.Aside .Count {
    background: #444;
    background-color: 
    rgba(0, 0, 0, 0.6);
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    color: #fff;
    font-size: 80%;
    font-weight: normal;
    padding: 1px .8ex;
    }

    ❌ ✊ ♥. ¸. ••. ¸♥¸. ••. ¸♥ ✊ ❌

  • Options
    snootysnooty Florida ✭

    Thanks much vrijvlinder. Mods can show this thread "solved" or "closed" if they wish.

Sign In or Register to comment.