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 here.
×
×
Cookie Preferences
We use Cookies to help personalize and improve Roll20. For more information on our use of non-essential Cookies, visit our Privacy Policy here.
Try using .ui-dialog .charsheet .repcontrol {position: absolute; top:0; } as a baseline and adjust as needed. You might have to assign a position: relative; to a parent element to keep placement manageable. ie either the repeating section itself or one parent up. some wiki info: <a href="https://wiki.roll20.net/CSS_Wizardry#Repeating_Sections" rel="nofollow">https://wiki.roll20.net/CSS_Wizardry#Repeating_Sections</a> Sidenote, moving the repcontrol from the end of the repeating sections might be confusing for some end-users. Just something to consider.
keithcurtis said: Is this on the D&D 5e (2014) Sheet? No, it's for a custom sheet that I made. I'm very bad at this, so it's a real mess. But it works. Thanks vInce, I'll try that.
Vince's suggestion should work, or is a step in the right direction. The buttons are inside a div with class repcontrol, which are inside the repeating section's div.
Yep, I'd recommend using CSS grid instead of positioning though: <div class="buttons-on-top">
<fieldset class="repeating_abilities">
<!-- Your repeating section as you have it now-->
</fieldset>
</div> .buttons-on-top{
display: grid;
grid-template-rows: auto 1fr;
grid-template-areas:
'control'
'rep';
align-content: start;
.repcontrol{
grid-area: control;
}
.repcontainer{
grid-area: rep;
}
} I'm using the newish nested css syntax here as it's a little easier to write; this can be used as is though and doesn't require a css preprocessor or anything special (CSS syntax highlighters haven't all updated to support this new syntax though so they may not highlight the code properly). You can also get a little more granular control by using display contents on the repcontrol container so that you can place each button separately: .buttons-on-top{
display: grid;
grid-template-rows: auto 1fr;
grid-template-columns: 1fr 1fr;
grid-template-areas:
'add edit'
'rep rep';
align-content: start;
.repcontrol{
display: contents;
}
.repcontrol_add{
grid-area: add;
place-self: center start;
}
.repcontrol_edit{
grid-area: edit;
place-self: center end;
}
.repcontainer{
grid-area: rep;
}
}
