Home Forums Support CSS dot

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
  • #623659

    after the update the CSS
    .dotrot {
    height: 15px;
    width: 15px;
    background-color: #d42f2f;
    border-radius: 50%;
    display: inline-block;
    doesn´t work.
    What am I doing wrong? I would like to define three different colored dots (it should be a marker behind the text).
    I’m grateful for any help.

    GeneratePress 2.1.3
    GP Premium 1.6.2
    Customer Support

    Hi there,

    Sorry not quite sure if I understand.

    Which elements are you trying to apply the CSS to?

    I don’t think dotrot class exist in the theme before or after the update.

    Let me know 🙂


    Hi Leo,
    I thought I can give classes in the CSS itself.

    What would be the right class to create different colored points (circles)?
    I would like a sort of rating system without a plugin. Thought with points it is easiest.
    – text …. red point
    – text …. green point
    – etc.

    Customer Support

    Hi there,

    would this ‘dot’ be after the text in a list? Or within a paragraph?


    Hi David,
    yes, I would use the dots in a listing.

    What did I need in a (for example) packing list and what not.
    I would like to have three different colored dots.

    Customer Support

    Ok, you could use this mark-up:

        <li class="dot green">Line with green dot</li>
        <li class="dot yellow">Line with amber dot</li>
        <li class="dot red">Line with red dot</li>

    With this CSS:

    .dot:after {
        content: "●";
        margin-left: 10px;
        font-size: 20px;
    .dot.green:after {
        color: green;
    .dot.yellow:after {
        color: yellow;
    .dot.red:after {
        color: red;

    Omg – It works – just as I imagined.
    Many many thanks!!

    Customer Support

    Thats great to hear. And you’re very welcome.

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