Celebrating 7 Years! Get up to $30 off GeneratePress Premium!

[Support request] Adding border (divider) lines between unsemantic columns

Home Forums Support [Support request] Adding border (divider) lines between unsemantic columns

Home Forums Support Adding border (divider) lines between unsemantic columns

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #542656
    Mike

    I have 2 rows of 2 columns in a section using unsemantic:

    <div class="grid-50 1st-col">1</div>
    <div class="grid-50 2nd-col">2</div>
    <div class="grid-50 3rd-col">3</div>
    <div class="grid-50 4th-col">4</div>

    I want to have some sort of dashed border “divider” lines between the columns, one horizontal and one vertical, so it looks sort of like this (but without the gaps of course):

    1st | 2nd
    ————–
    3rd | 4th

    I believe the best way is to use the CSS ::before and ::after. Attempted some myself but couldn’t get it to work. Digging a bit in browser’s developer tools, it seems Unsemantic added some of its own ::before and ::after styles that may cause some conflicts.

    Any idea how to achieve this with the least hassle?

    Thanks.

    GeneratePress 2.0.2
    GP Premium 1.6.2
    #543024
    Leo
    Staff
    Customer Support

    Hi there,

    Can you link me to what you have so far?

    I wonder if it would be better to use table in this case.

    Let me know.

Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.