Roll20 uses cookies to improve your experience on our site. Cookies enable you to enjoy certain features, social sharing functionality, and tailor message and display ads to your interests on our site and others. They also help us understand how our site is being used. By continuing to use our site, you consent to our use of cookies. Update your cookie preferences .
×
Create a free account

Inline Roll: My CSS is not being recognized

February 28 (1 month ago)

Edited February 28 (1 month ago)

I'm a bit stumped, been trying to style the .inlinerollresult in my CSS file but it's not being recognized in my roll templates.

Here are the relevant codes:

CSS

.sheet-rolltemplate-rollCheck .inlinerollresult  {
        background:#000
    }


Html

<rolltemplate class="sheet-rolltemplate-rollCheck">
    <div style="border: 1px solid #2b4a42; border-radius: 6px; background: #fff; margin-left: -7px; overflow-x: hidden; padding: 5px;">
        <table style="width:100%;">
            <tr>
                <td style="font-size:13pt;padding:3px;">
                    {{checkName}}
                </td>
                <td rowspan="2" style="text-align:center;font-size:13pt;">
                    {{checkTotal}}
                </td>
            </tr>
            <tr>
                <td style="padding-left:12px;">
                    {{characterName}}
                </td>
            </tr>
        </table>
    </div>
</rolltemplate>

February 28 (1 month ago)

Edited February 28 (1 month ago)
GiGs
Pro
Sheet Author
API Scripter

inlinrollresult needs a lot of specificity. Try putting .ui-dialog .charsheet in the declaration, like

.ui-dialog .charsheet .sheet-rolltemplate-rollCheck .inlinerollresult  {
        background:#000;
}

You probably only need one of those classes.

I usually pick something inside the rolltemplate that has a class, so nay rolls inside that section get effected. So that would be

.sheet-rolltemplate-rollCheck .sheet-mychosenclass .inlinerollresult  {
        background:#000;
}

Also you might need to use background-color instead of background - I don't recall.

February 28 (1 month ago)
Scott C.
Forum Champion
Sheet Author
API Scripter
Compendium Curator

.ui-dialog .charaheet is only for styling on the sheet itself. For roll templates, you need at least one additional class beyond the roll template class itself. I usually put a wrapper element around the content of the roll template just so I have that additional class.

February 28 (1 month ago)
GiGs
Pro
Sheet Author
API Scripter


Scott C. said:

.ui-dialog .charaheet is only for styling on the sheet itself. For roll templates, you need at least one additional class beyond the roll template class itself. I usually put a wrapper element around the content of the roll template just so I have that additional class.

I do that too. This may be why.

March 03 (1 month ago)

Thank you for all your responses, being more specific helped me!