Category drop down too wide

  • Resolved gabby_wordpress

    (@gabby_wordpress)


    8 years, 10 months ago

    Hi,

    Using theme Twenty Twelwe.

    On my blog: https://gabbychallenge.glundh.se/wordpress/ I have noticed that the drop down for my Categories is too wide due to that my Categories are very long. I do not want to shorten my Categories but would like to know if it is possible to make the drop down less wide on the front page. When you are clicking on the drop down Arrow the list with all the categories should be as long as the categories.

    I have heard that I probably must create a child theme. If that is the case I would like to know how to do it step-by-step. I have not created a Child theme Before and I am not a php developer so I do not know what files need to be created and what code need to be used.

    I have a snapshot to clarify what I mean but cannot attach it in this post.

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

  • You could use a Custom CSS plugin for any changes to this.

    Choose a Custom CSS plugin.
    Install and activate it through the Plugins > New.
    Inserting this code in it should limit the width of the dropdown, but it will hide the last letters/numbers of long lines:

    aside .widget_categories {
width: 100%;
overflow: hidden;
}

    This code will make the font size smaller:

    aside .widget_categories {
font-size: 0.875rem;
}

    Hi gabby_wordpress…

    You could use a Custom CSS plugin for any changes to this.

    Choose a Custom CSS plugin.
    Install and activate it through the Plugins > New.
    Inserting this code in it should limit the width of the dropdown, but it will hide the last letters/numbers of long lines:

    aside .widget_categories {
width: 100%;
overflow: hidden;
}

    This code will make the font size smaller:

    aside .widget_categories {
font-size: 0.875rem;
}
    Thread Starter gabby_wordpress

    (@gabby_wordpress)

    Hi,

    I will test a Custom CSS plugin. Have you a plugin to recommend?

    I will test both your suggestions.

    Will the list with the Categories when you click on the “drop down Arrow” be as wide as the categories or it will be affected as well?

    Thank you so much.

    Will the list with the Categories when you click on the “drop down Arrow” be as wide as the categories or it will be affected as well?

    The entire widget, including the dropdown, should stay within the boundaries of the sidebar and be the same width. If not, some adjustments to the code would solve that.

    Thread Starter gabby_wordpress

    (@gabby_wordpress)

    I have installed the custom css plugin Simple Custom CSS. Tested your first code part but nothing happens. Changed the width to 10% but it is still too wide.

    Changed the width to 10% but it is still too wide.

    That should be “100%”, not “10%”.

    #categories-2,
#categories-2 option {
width: 100% !important;
overflow: hidden;
}
    #categories-2 option {
font-size: 0.875rem;
}

    Just try this CSS

    #cat{width:100%;}

    Thread Starter gabby_wordpress

    (@gabby_wordpress)

    Hi, problem solves.

    Tried #cat{width:100%;}

    Love simple solution and the list with the categories has not been affected.

    Thanks.

    Installed Simple Custom CSS

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Category drop down too wide’ is closed to new replies.