Format tag cloud

Hi there,

if you can add the tag cloud to the footer widget then i can help with some CSS to make the style you need.

Hey David,

I just added the tag cloud on my blog.

Have a look: http://www.techtechnik.com/

Reference site: https://www.smashingmagazine.com/

Also, In my mobile view, I am looking after the same format as a reference site.

Thanks

Give this a shot:

.tagcloud {
    text-align: center;
}

a.tag-cloud-link {
    font-size: 1em !important; 
    margin: .25em;
    text-transform: capitalize;
    word-break: break-word;
}

a.tag-cloud-link:before {
    content: '\2022'; 
    font-size: 1.5em;
    margin-right: 0.5em;
}

Hii,

Yeah it looks good after applying the code.

other thing is how can I show the tag cloud in two column in mobile view?
Just like this: http://prntscr.com/l1x0s1, source: https://www.smashingmagazine.com/

Thanks

Try this:

@media (max-width: 420px) {
    .tagcloud {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        text-align: left;
    }
    a.tag-cloud-link {
        width: 45%;
    }
}

Hi,

It didn't worked.

Thanks

Ooops can you try the edited code above, i added an extra hyphen. Once done can you flush any caches.

Hey David,

Now its working but I was wondering is it possible to get bullets align in a straight line in mobile view?

http://prntscr.com/l225sy as shown and marked in red line.

Thanks

Updated code here with a text-align property.

Now it looks great.

Thanks :)

You're welcome :)