Delete buttons for repeating rows floating and overlapping

Anyone ever experienced an issue where the delete (and move) buttons on all items in a repeating section float and overlap? I’m using code that I was using in a previous sheet and it worked fine, so I assume it may be a mistake in my CSS, maybe? I’ve used the inspector in Chrome and found no differences, so maybe it is some other weird inheritance I’m missing?

On further inspection, I found that this div: <div class="repcontainer ui-sortable editmode" data-groupname="repeating_npclist"> has a height of 0.... but I can't figure out why. That seems the cause of the whole issue. Any ideas? I didn't mess with any of those classes.

I think anyone who might be able to help you would need more context and concrete code examples to say much anything. What character sheet sis you use originally, and do you have a link to your version of the sheet? And did you view your sheet inside the game itself, or only the preview window for custom sheets? It's never 100% accurate, and should only be seen as an approximate representation of how the sheet looks like. Some sheets use a bit of advanced sheetworkers(javascript) to adjust some visuals of a sheet and might rely on attribute values from a sheet, neither of which can be accessed in the preview window. One example could be that each character sheet gets created with a hidden attribute named "sheetpage" , and it's numerical value might control which of the character sheet's pages it is showing, in the case of sheet's with multiple pages. From the little I have to go with, I can tell you that some sheets have used the  "height=0" -trick to temporally hide sections, or to toggle between having a section in "view" or "edit"-mode. If you search the CSS you are likely finding the same section being changed of some other condition is met, such as a related checkbox being checked.

Thanks. I was just hoping some other author had run into the issue before. It would save me a ton of code checking. I wrote the sheet and the CSS from scratch, I imagine one of the styles I have has somehow messed up the sizing of the repeating element control group. I already checked for any of the obvious, like changes to div, and I didn't do anything silly like that. Everything I have is my own classes. I'll start thru the code. I have another sheet I wrote where everything works perfectly with identical code so use of the Chrome inspector should help me find the exact cause.

If your repcontainer has a height of 0, then that's because somehow all contained .repitem divs have a height of 0. What's the content of a repeating row and what are the display properties on the items within. One guess would be that you're doing something like making the repitems inline, that won't work well. But since you're not messing with these classes, properly not. Another guess: are you positioning everything within a repeating row absolutely? If so, they would not contribute to the dimensions of their parent .repitem divs.

Found the cause. Not sure how it had an impact, but I had some changes to the box-sizing property of multiple html elements and it seems like it caused most of the issue. Once I changed those to only impact my classes, the problem cleared up. Jakob said: If your repcontainer has a height of 0, then that's because somehow all contained .repitem divs have a height of 0. What's the content of a repeating row and what are the display properties on the items within. One guess would be that you're doing something like making the repitems inline, that won't work well. But since you're not messing with these classes, properly not. Another guess: are you positioning everything within a repeating row absolutely? If so, they would not contribute to the dimensions of their parent .repitem divs.