CMS Development

jtracy
Member

Alphabetize and re-arrange blog category buttons

 

0 Upvotes
1 Reply 1
chuckchoi
HubSpot Employee
HubSpot Employee

Alphabetize and re-arrange blog category buttons

Hello @jtracy ,

 

Welcome to HubSpot! Seems like the items appear in alphabetical order. I see that the items listed will stack below the first row if the screensizes get smaller and the items won't fit anymore. It is possible to fix it by removing the media query below:

 

 

@media only screen and (max-width: 980px)
.list-categories ul li a {
min-width: 123px
}

This would allow each of the colored boxes to fluctuate based on the content inside!

 

 

 

and you should add the code below

 

.list-categories ul li a {
font-size: 1vw;
}

 

The code above would have the text to change its font size based on the size of the screen.

 

Only thing is that if you try to have all the colored tags to appear in one row, the text would be so small making it invisible for mobile users. How it is set up should be perfect, or you can try changing the design to make it both visible and organized in mobile view.

 

Hope this answers your question!

 

Cheers,

 

Chuck

 
0 Upvotes