Horizontal top menu - text in 2 rows

[b.tsvetkov]

Hallo,

This is my page http://ochilarka.com

I want to make categories fields and text smaller and to be in 1 row. And the name of the categories to be in 2 rows.

Thank you!

[vekia]

.sf-menu > li > a {
    font: 600 18px/22px "Open Sans", sans-serif;
    text-transform: uppercase;
    color: #484848;
    display: block;
    padding: 17px 20px;
    border-bottom: 3px solid #e9e9e9;
}

change paddings or font size (18px/22px)

file: http://ochilarka.com/themes/default-bootstrap/css/modules/blocktopmenu/css/superfish-modified.css (line ~60)

 

 

effect with code like:

.sf-menu > li > a {
    font: 600 16px "Open Sans", sans-serif;
    text-transform: uppercase;
    color: #484848;
    display: block;
    padding: 17px 10px;
    border-bottom: 3px solid #e9e9e9;
}

[b.tsvetkov]

Thank you!

 

I have another question: How to make subcategories show in column not in row.

[b.tsvetkov]

.sf-menu > li > a {
    font: 600 18px/22px "Open Sans", sans-serif;
    text-transform: uppercase;
    color: #484848;
    display: block;
    padding: 17px 20px;
    border-bottom: 3px solid #e9e9e9;
}

change paddings or font size (18px/22px)

file: http://ochilarka.com/themes/default-bootstrap/css/modules/blocktopmenu/css/superfish-modified.css (line ~60)

 

 

effect with code like:

.sf-menu > li > a {
    font: 600 16px "Open Sans", sans-serif;
    text-transform: uppercase;
    color: #484848;
    display: block;
    padding: 17px 10px;
    border-bottom: 3px solid #e9e9e9;
}

 

 

Thank you! 

I need the text to be in more than one row. Do you any solution for this problem? The names of the categories are too long for one row.

[giulomas]

Hi, is there any way to split a too long name button in two rows instead than in a single one? Some css rule, I suppose...