Columns & Rows

  • Hello,

    Can someone please share a css snippet that might help facilitate multiple columns and rows? I grabbed the css from lokafy example was nice but it requires more advanced knowledge than I have to make the necessary to adjustments. I’m simply looking to display four staff members in a row and to wrap to the next row. If there is a way to punch in a short code to insert an individual staff member I could make real easy business of this, but that option doesn’t seem to exist. Any help is appreciated.

    Thanks

    https://www.ads-software.com/plugins/simple-staff-list/

Viewing 5 replies - 1 through 5 (of 5 total)

  • Love this plugin, but I have the same question. I really need to put them in rows/columns as I have over 20 staff members. Help?

    https://dev.salonbluhair.com/salons/midtown/stylists/

    You’re probably going to want to use something like this (pulled from a page I’m working on):

    div.staff-member {
width: 180px;
height: 240px;
overflow: hidden;
float: left;
margin: 10px 5px;
border: 1px solid #6c6c6c;
border-radius: 3px;
position: relative;
}

    Float is the key element to what you’re trying to do, and you can specify exactly how many items show show up by determining the width and margin of the element.

    Additionally, you may need to remove some of the default plugin styling and you will also need to have some sort of clearfix, either a <div style="clear:both"></div> after your staff-list or use overflow:hidden on the parent div.

    jerzy22

    (@jerzy22)

    Thanks, gsbrock. That worked immensely for me.

    If I wanted to go about centering the text within the box/border, how would I go about that?

    I’m new to WP/coding.

    Thanks in advance.

    gsbrock

    (@gsbrock)

    oh boy, well the short answer is for centering: it depends ??

    If you’re just doing text you should be able to use the text-align property for horizontal positoning and the vertical-align property for vertical positioning.

    If you’re trying to do image or div centering, it’s more complex.

    jerzy22

    (@jerzy22)

    Thanks, gsbrock. Much appreciated.

    Not using an image in this plug-in. Just the text within the box.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Columns & Rows’ is closed to new replies.