Show category

Hi there,

if you want to set up the page with the Category list widget and provide a link then we can probably help with some CSS to make them into rows.

Hi David,

Thanks for your message. The link to my site: https://vanderwerffcontrolling.nl/

Below the text "Meer fiscale informatie of artikelen over belasting" you can see the categories are vertical instead of horizontal.

Hopefully you can help me :)

I also would like to have a ">>" seperator between the categories, do you know if this is also possible with css?

Thanks!

Mark

Give this CSS a shot:

.DisplayCategoriesWidget ul.dcw {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.DisplayCategoriesWidget ul.dcw li {
    text-align: center;
    width: auto;
    margin: 10px;
}
.DisplayCategoriesWidget ul.dcw li a:before {
    content: '\00BB';
    margin-right: 14px;
}

Thanks David it looks really great!! :D

Few last things:

with the last category, the >> is missing. With the text "Belating aangifte"

And the layout on mobile phone is not really structured.

Kindly regards,

Mark

Awesome. Sorry i made an edit to the code above so the last category has the double caret. How would you want them on mobile? Personally i think just a list. let me know and ill update the code.

Hi David,

Thanks a lot! I really appreciate the outstanding support. Well, I really like the following layout for mobile:

https://imgur.com/a/eTP7J6c

do you think we can apply some custom CSS to accomplish something like this?

Kindly regards,

Mark

Made another edit to the code above. This should just let them flow.

Excellent David! Thanks again for the amazing support.

Mark

You're welcome. Glad to be of help. BTW you can a color property to the last CSS rule - this one: .DisplayCategoriesWidget ul.dcw li a:before { to change the >> color :)