Plugin or library in a theme, doesn’t matter, it’s still CMB2, so you’re still in the right place.
Regarding placeholder text, see my reply at https://ww.wp.xz.cn/support/topic/limit-number-of-characters-per-text-field?replies=5#post-7681095 for an example of adding custom attributes to fields.
It should work in repeatable groups, but I haven’t tested.
There’s no for sure “best” way to handle the floating of the text, just going to have to tinker a bit with what’s rendered and your custom stylesheet.
Place holder and title has taken care of.
A screenshot of the form I am trying to achieve.
here’s the default code output by CMB2
<div class="inside cmb-td cmb-nested cmb-field-list">
<div class="cmb-row cmb-type-text-medium cmb2-id--co-lorem-loremGroup-id-0--co-lorem-loremTitle cmb-repeat-group-field">
<strong><div class="cmb-td"></strong>
<label for="_co_lorem_loremGroup_id_0__co_lorem_loremTitle" style="display:none;">lorem Title</label>
<input type="text" placeholder="lorem Title" value="" id="_co_lorem_loremGroup_id_0__co_lorem_loremTitle" name="_co_lorem_loremGroup_id[0][_co_lorem_loremTitle]" class="cmb2-text-medium">
</div>
</div>
<div class="cmb-row cmb-type-text-url cmb2-id--co-lorem-loremGroup-id-0--co-lorem-loremURL cmb-repeat-group-field table-layout">
<strong><div class="cmb-td"></strong>
<label for="_co_lorem_loremGroup_id_0__co_lorem_loremURL" style="display:none;">lorem Link</label>
<input type="text" placeholder="lorem Link" value="" id="_co_lorem_loremGroup_id_0__co_lorem_loremURL" name="_co_lorem_loremGroup_id[0][_co_lorem_loremURL]" class="cmb2-text-url cmb2-text-medium regular-text">
</div>
</div>
<div class="cmb-row cmb-remove-field-row">
<div class="cmb-remove-row"> <a href="#" class="button cmb-shift-rows move-up alignleft"><span class="dashicons dashicons-arrow-up-alt2"></span></a> <a href="#" class="button cmb-shift-rows move-down alignleft"><span class="dashicons dashicons-arrow-down-alt2"></span></a>
<button class="button cmb-remove-group-row alignright" data-selector="_co_lorem_loremGroup_id_repeat" disabled="disabled">Remove this lorem</button>
</div>
</div>
</div>
And here what I want both cmb-td div in the samae cmb-row
<div class="inside cmb-td cmb-nested cmb-field-list">
<div class="cmb-row cmb-type-text-medium cmb2-id--co-lorem-loremGroup-id-0--co-lorem-loremTitle cmb-repeat-group-field">
<div class="cmb-td">
<label for="_co_lorem_loremGroup_id_0__co_lorem_loremTitle" style="display:none;">lorem Title</label>
<input type="text" placeholder="lorem Title" value="" id="_co_lorem_loremGroup_id_0__co_lorem_loremTitle" name="_co_lorem_loremGroup_id[0][_co_lorem_loremTitle]" class="cmb2-text-medium">
</div>
<div class="cmb-td">
<label for="_co_lorem_loremGroup_id_0__co_lorem_loremURL" style="display:none;">lorem Link</label>
<input type="text" placeholder="lorem Link" value="" id="_co_lorem_loremGroup_id_0__co_lorem_loremURL" name="_co_lorem_loremGroup_id[0][_co_lorem_loremURL]" class="cmb2-text-url cmb2-text-medium regular-text">
</div>
</div>
<div class="cmb-row cmb-remove-field-row">
<div class="cmb-remove-row"> <a href="#" class="button cmb-shift-rows move-up alignleft"><span class="dashicons dashicons-arrow-up-alt2"></span></a> <a href="#" class="button cmb-shift-rows move-down alignleft"><span class="dashicons dashicons-arrow-down-alt2"></span></a>
<button class="button cmb-remove-group-row alignright" data-selector="_co_lorem_loremGroup_id_repeat" disabled="disabled">Remove this lorem</button>
</div>
</div>
</div>
For that, you’ll need to either create a custom field type, or use the 'before_row' field attribute on the first input and the 'after_row' field attribute on the second input to add your own wrapper markup.
