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

Problems with css on character sheet

Hello, I am trying to create my first custom character sheet. I am following the pathfinder character sheet but I am encountering some issues: 1 - In the character sheet preview the FOR button appears as it should (black background and white letters) but within the campaign, when I open a token it appears opaque and only turns black with white letters if I hover over it. 2 - In sheet-input sheet-table-val-for, sheet-table-mod-for, sheet-table-test-for I can't apply the following css commands: &nbsp; &nbsp; &nbsp;border: 1px solid; &nbsp; &nbsp; &nbsp;border-left: 1px; &nbsp; &nbsp; &nbsp;border-right: 1px; &nbsp; &nbsp; &nbsp;border-top: 1px; &nbsp; &nbsp; &nbsp;background-color: none; &nbsp; &nbsp; &nbsp;text-align: center; Could someone help me find a solution? Link HTML code&nbsp; <a href="https://pastebin.com/JpUmZuWR" rel="nofollow">https://pastebin.com/JpUmZuWR</a> Link CSS code&nbsp; <a href="https://pastebin.com/srZBbWix" rel="nofollow">https://pastebin.com/srZBbWix</a>
1564282866
vÍnce
Pro
Sheet Author
Response here: <a href="https://app.roll20.net/forum/permalink/7643710/" rel="nofollow">https://app.roll20.net/forum/permalink/7643710/</a>
Vince's post on old thread: You might want to post a snippet of the html and css pertaining to this section of your sheet.&nbsp; &nbsp;You can also try adding a background: black and font color: white; to your css to see if it helps. &nbsp; &nbsp; &nbsp;border: 1px solid; &nbsp; &nbsp; &nbsp;border-left: 1px; &nbsp; &nbsp; &nbsp;border-right: 1px; &nbsp; &nbsp; &nbsp;border-top: 1px; &nbsp; &nbsp; &nbsp;background: #000; &nbsp;&nbsp;&nbsp;&nbsp; color: #FFF; &nbsp; &nbsp; &nbsp;text-align: center; EDIT/update : you posted your code in another post (thanks for posting your code).&nbsp; Included here to help solve your issue in this thread. ;-) Link HTML code&nbsp; <a href="https://pastebin.com/JpUmZuWR" rel="nofollow">https://pastebin.com/JpUmZuWR</a> Link CSS code&nbsp; <a href="https://pastebin.com/srZBbWix" rel="nofollow">https://pastebin.com/srZBbWix</a> Change "background-color: none;" to "background: #000;" .sheet-text-button { background: #000; color: #FFF; }
Hello Bernice, thanks for the help, I'll be more careful with the posts, ok? Vince's help was great at solving doubt 1, but doubt 2 I couldn't solve. In the header items (nome, jogador, raça, etc.) I was able to adjust the borders for the model I would like but in the attribute fields (valor, mod and teste) I could not make the same adjustment, is it due to these fields being numeric? Is there a way to solve?
1564361999

Edited 1564362031
vÍnce
Pro
Sheet Author
If you want to target "number" fields on your sheet, try input[type="number"] { &nbsp; &nbsp; width: 3.5em; &nbsp; &nbsp; border: 2px solid #000; } If you only want to target specific number fields, you'll probably need to create a class for them example; css input[type="number"] .sheet-input-wide { width: 5em; border: 2px solid #000; } html &lt;input class=" sheet-input-wide " title="FOR" type="number" name="attr_FOR" value=""&gt; .
great, it worked! Thanks so much again Vince!