Have a new working basic Shadowrun 2E sheet, all working just need some help with coding a tiny bit.

  I have looked everywhere for this and can't seem to find out how to do it.  I want this section so that the catagories are on the top, not on the side of the area it corresponds with, I hope that makes sense.  Code available if needed.

Use either CSS Flexbox or CSS Grid to create a layout for your sections: <a href="https://wiki.roll20.net/Designing_Character_Sheet_Layout" rel="nofollow">https://wiki.roll20.net/Designing_Character_Sheet_Layout</a> If your problem with Repeating sections, check this: <a href="https://wiki.roll20.net/Building_Character_Sheets#Repeating_Sections" rel="nofollow">https://wiki.roll20.net/Building_Character_Sheets#Repeating_Sections</a> Share your code, and a larger picture of your sheet, it's hard to tell exactly what's going on in it now, and without the code we can't do anything else than share some generic advice.

Okay so here is the code underneath the picture of how i would like it.&nbsp; I just want the words above the input section, so it neatens it up.&nbsp; Repeating fields are fine and I understand them and how to use them and format them.&nbsp; The red arrow on piccy indicates how i would like it.&nbsp; Hope it makes sense. &lt;div class="sheet-row"&gt; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &lt;h2&gt;Spells&lt;/h2&gt; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; Spells Stacked: &lt;input type='number' name='attr_spellstack' min=0 value=0 /&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Spells Sustained: &lt;input type='number' name='attr_spellsus' min=0 value=0 /&gt; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &lt;br&gt;&lt;br&gt; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &lt;fieldset class="repeating_spells"&gt;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; Name:&lt;input type="text" style="width:130px"name="attr_spellname" /&gt; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; Force:&lt;input type="number" name="attr_force" value=1 min=1 /&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Type:&nbsp;&nbsp;&nbsp; &lt;select name="attr_spelltype" style="width:50px"&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &lt;option value="mana"&gt;M&lt;/option&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &lt;option value="physical"&gt;P&lt;/option&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &lt;/select&gt; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; Range:&lt;input type="text" name="attr_spellrange" style='width:55px' /&gt; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; Target:&lt;input type="text" name="attr_target" style='width:80px' /&gt; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; Damage:&lt;select name="attr_spelldmg" style="width:50px"/&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;option SELECTED&gt;N/A&lt;/option&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;option&gt;L&lt;/option&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;option&gt;M&lt;/option&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;option&gt;S&lt;/option&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;option&gt;D&lt;/option&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;/select&gt; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; Duration:&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;select name="attr_duration" style="width:50px"/&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;option SELECTED&gt;I&lt;/option&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;option&gt;S&lt;/option&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;option&gt;P&lt;/option&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/select&gt; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; F/2 +&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;input type="number" name="attr_drain" value=0 style="width:50px" /&gt; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;select name="attr_drainlvl" style="width:50px"/&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;option SELECTED&gt;L&lt;/option&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;option&gt;M&lt;/option&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;option&gt;S&lt;/option&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;option&gt;D&lt;/option&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;/select&gt; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; Base TN: &lt;input type='number' name='attr_castTN' value=4 min=2 /&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Modifiers (barrier/lodge/etc): &lt;input type='number' name='attr_spellmisc' /&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Cast Force &lt;input type='number' name='attr_castforce' value=1 min=1 /&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;button type="roll" class="d6-dice" name="roll_cast_spell" title="Cast Spell" value="&amp;{template:spell}{{spellname=@{spellname}}}{{description=@{spelldesc}}}{{casttest=[[[[@{castforce}+?{How many dice are you taking for casting?|0}]]d6&gt;[[{@{castTN}+2*(@{spellstack}+@{spellsus})+@{spellmisc}+@{stun_pen}+@{wound_pen},2}kh1]]!!}]]}}{{draintest=[[[[@{willpower|max}+?{How many dice are you taking for drain resistance?|0}]]d6&gt;[[{floor(@{castforce}/2)+@{drain},2}kh1]]!!]]}}"&gt;&lt;/button&gt;&lt;br&gt;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; Description:&nbsp;&nbsp;&nbsp; &lt;textarea name='attr_spelldesc' width=100%&gt;&lt;/textarea&gt;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &lt;/fieldset&gt;

Split up the Name and the info field into separate divs, and then use flexbox to align elements in the sections: Range:&lt;input type="text" name="attr_spellrange" style='width:55px' /&gt; would be: &lt;div class="stat-col"&gt; &lt;span&gt;Range:&lt;/span&gt; &lt;div&gt; &lt;input type="text" name="attr_spellrange" style='width:55px' /&gt; &lt;/div&gt; &lt;/div&gt; and in the css: .sheet-stat-col{ display: flex; flex-flow: column nowrap; } Inputs and selects dont flow well by themselves in Flexbox nor CSS Grid, so wrapping then in an otherwise empty div is usually smart. Please get familiar with the Layout dsesign page, it gives short example and gives links on how to learn Flexbox &amp; Grid: <a href="https://wiki.roll20.net/Designing_Character_Sheet_Layout" rel="nofollow">https://wiki.roll20.net/Designing_Character_Sheet_Layout</a> You could also make the whole thing a css grid that has two rows, where the names are in the top row and the other part in the bottom row. You might need to adjust the width of individual elements, or how wide each column should be.

Thanks alot.&nbsp; I will play around with both.&nbsp; I have learnt alot just doing this sheet and debugging myself, its been fun.&nbsp; I really need to get to grips with CSS.&nbsp; Thanks again.

Darren H. said: Thanks alot.&nbsp; I will play around with both.&nbsp; I have learnt alot just doing this sheet and debugging myself, its been fun.&nbsp; I really need to get to grips with CSS.&nbsp; Thanks again. I, for one, am rooting for you man! Been waiting for a new 2e sheet for a while now, and I've been watching your progress on this from the sidelines. It's already looking great, keep up the great work!

The sheet itself works, have tested all the rolls with the group I play with (currently playing Deadlands but when finished going for Shadowrun 2E).&nbsp; I just need to finish off the Lifestyle section, and add in some stuff for Shamans in the Magic Tab. Was thinking of adding a section in the Combat Section to put the players combat skills to make it easier to enter them in when using the Combat Tab It's by no means a perfect sheet, but it works lol.&nbsp; Try and get time to finish it this week.&nbsp; I've added in a few things from the Shadowrun Companion.&nbsp; I'm pleased with it.&nbsp; After finished I will upload it for general use.

That's great! The changes I'd love to see made to the current sheet (besides the layout) are as follows: some rolls ask you to input how many dice pool dice you want to use, but then don't split out the results so that you can see which successes came naturally and which came from your dice pool (Combat, Magic, etc.) making a melee test from the skill list does not allow you to input the Target Number, it only defaults to 4. This doesn't allow for modifiers like reach or wound penalties. That's all I've caught, but I've honestly not messed with it much. (Edit: Removed snark)

Ben said: some rolls ask you to input how many dice pool dice you want to use, but then don't split out the results so that you can see which successes came naturally and which came from your dice pool (Combat, Magic, etc.) I haven't used the sheet but i can tell you that what you're asking for here was impossible to do a while ago without an API Script (needing Pro subscription). It might be possible now with the Reusing Rolls trick (see wiki), but it's still tricky. So try not to be too hard on the sheet over that part - they were working with roll20's limitations.

GiGs said: Ben said: some rolls ask you to input how many dice pool dice you want to use, but then don't split out the results so that you can see which successes came naturally and which came from your dice pool (Combat, Magic, etc.) I haven't used the sheet but i can tell you that what you're asking for here was impossible to do a while ago without an API Script (needing Pro subscription). It might be possible now with the Reusing Rolls trick (see wiki), but it's still tricky. So try not to be too hard on the sheet over that part - they were working with roll20's limitations. Well, the only reason I phrased it that way is that some other rolls on the sheet did split out the dice pool results. So it felt kind of arbitrarily left out for others. Even so, you're right about giving the old sheet a hard time, and&nbsp;I edited my post to sound less like a whiner and a little more constructive. Cheers, chummer!

All the combat related stuff is now under the Combat tab.&nbsp; This is so all the TN can be determined from all the variables, and the combat skills and skill rating can be listed in this section so when you roll a Combat skill you can simply put in the Rating of the skill being used without having to change tabs.&nbsp; All the combat rolls show how many pool dice, will have to check for magic, can't remember. Other work still to do is to stop some parts not collapsing properly when the window is resized.&nbsp; It's getting there.&nbsp; This is my first foray into character sheet creation and am working with someone else code.&nbsp; After this I may create one from scratch, maybe for Traveller: TNE.

Darren H. said: All the combat related stuff is now under the Combat tab.&nbsp; This is so all the TN can be determined from all the variables, and the combat skills and skill rating can be listed in this section so when you roll a Combat skill you can simply put in the Rating of the skill being used without having to change tabs.&nbsp; All the combat rolls show how many pool dice, will have to check for magic, can't remember. Other work still to do is to stop some parts not collapsing properly when the window is resized.&nbsp; It's getting there.&nbsp; This is my first foray into character sheet creation and am working with someone else code.&nbsp; After this I may create one from scratch, maybe for Traveller: TNE. That sounds great, can't wait!