[SOLUCIONADO] Ancho de enlaces de menú

[auroaff]

Hola, tengo un sitio responsive en wordpress. No lo hice yo, pero tengo necesidad de editar el menú. Actualmente los enlaces del menu, se muestran a lo largo de acuerdo a su ancho, pero necesito que se muestren en doble o triple linea, ya que son largos. Ya encontré donde está el css de esa area, pero no encuentro donde modificar esa sección. Cuando cambio el width, lo que altera es el ancho general del menu y necesito que sea el ancho de cada botón por así decirlo. Que es lo que mi lógica me dice que es lo que habría que hacer para lograr que quede como se desea. Gracias por cualquier pista o si estoy buscando en el área incorrecta.


El area de css que me parece es la que debe editar es esta:

Código:

.mainHeader {
  background: #FEFEF8;
  /* Rectangle 52: */
  background-image: -o-linear-gradient(-90deg, rgba(255, 255, 255, 0) 0%, rgba(251, 250, 233, 0.81) 52%, #fbfae4 100%);
  background-image: -moz-linear-gradient(-90deg, rgba(255, 255, 255, 0) 0%, rgba(251, 250, 233, 0.81) 52%, #fbfae4 100%);
  background-image: -webkit-linear-gradient(-90deg, rgba(255, 255, 255, 0) 0%, rgba(251, 250, 233, 0.81) 52%, #fbfae4 100%);
  background-image: -ms-linear-gradient(-90deg, rgba(255, 255, 255, 0) 0%, rgba(251, 250, 233, 0.81) 52%, #fbfae4 100%);
  background-image: linear-gradient(-180deg, rgba(255, 255, 255, 0) 0%, rgba(251, 250, 233, 0.81) 52%, #fbfae4 100%);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
 
  }
.mainHeader:after {
  display: block;
  clear: both;
  content: " ";
  height: 1px;
  width: 100%;
}
.mainHeader .dropdownnav {
  z-index: 100;
  font-size: .75em;
  vertical-align: top;
  /* DESKTOP */
}
@media screen and (min-width: 1023px) {
  .mainHeader .dropdownnav {
    font-size: .8125em;
  }
}
.mainHeader .dropdownnav ul,
.mainHeader .dropdownnav li {
  list-style: none;
  margin: 0;
  padding: 0;
 
}
.mainHeader .dropdownnav a {
  text-decoration: none;
  color: #86593a;
}
.mainHeader .dropdownnav a:hover,
.mainHeader .dropdownnav a:active,
.mainHeader .dropdownnav a:focus {
  color: #ffffff;
}
.mainHeader .dropdownnav > .label {
  display: block;
  /* TABLETS */
  float: left;
  font-size: 1.5em;
  padding-top: .7em;
  margin-left: 2.5em;
  line-height: 1;
  overflow: hidden;
}
@media all and (min-width: 1023px) {
  .mainHeader .dropdownnav > .label {
    display: none;
  }
}
.mainHeader .dropdownnav > a {
  display: none;
}
.mainHeader .dropdownnav > ul {
  background-color: none;
  color: #86593a;
  list-style: none;
  padding: 0;
  margin: 0;
  text-align: center;
}
.mainHeader .dropdownnav > ul:after {
  display: block;
  clear: both;
  content: " ";
}
.mainHeader .dropdownnav > ul > li {
  display: inline-block;
  height: 100%;
  text-align: left;
}
.mainHeader .dropdownnav > ul > li > a {
  height: 100%;
  line-height: 2.5em;
  text-align: center;
  padding: .25em .25em;
}
.mainHeader .dropdownnav > ul > li:hover,
.mainHeader .dropdownnav > ul > li:hover > a {
  color: #ffffff;
  background-color: #8c1f37;
}
.mainHeader .dropdownnav > ul > li:not( :last-child ) > a {
  border-right: 1px solid #e8e8c0;
}
.mainHeader .dropdownnav > ul:not( :hover ) > li.active > a {
  color: #ffffff;
  background-color: #8c1f37;
}
.mainHeader .dropdownnav li {
  position: relative;
}
.mainHeader .dropdownnav li a {
  color: #86593a;
  display: block;
}
.mainHeader .dropdownnav li a:hover,
.mainHeader .dropdownnav li a:active,
.mainHeader .dropdownnav li a:focus {
  background: #8c1f37;
  color: #ffffff;
}
.mainHeader .dropdownnav li ul {
  background-color: #8c1f37;
  color: #ffffff;
  display: none;
  position: absolute;
  top: 100%;
  z-index: 100;
}
.mainHeader .dropdownnav li ul li a {
  border-top: 1px solid #e8e8c0;
  padding: .75em;
  color: rgba(255, 255, 255, 0.8);
}
.mainHeader .dropdownnav li ul li a:hover {
  color: #ffffff;
  background-color: #b62847;
}
.mainHeader .dropdownnav li ul:not( :hover ) li.active a {
  background-color: #8c1f37;
  color: #ffffff;
}
.mainHeader .dropdownnav li:hover ul {
  display: block;
  left: 0;
  right: 0;
}
.mainHeader .dropdownnav li:not( :first-child ):hover ul {
  left: -1px;
}
.mainHeader .dropdownnav span.hasChild:after {
  border: .313em solid transparent;
  border-bottom: none;
  border-top-color: #8c1f37;
  content: '';
  display: inline-block;
  height: 0;
  position: relative;
  right: -0.313em;
  vertical-align: middle;
  width: 0;
}
@media only screen and (max-width: 1023px) {
  .mainHeader .dropdownnav {
    margin: 0;
    position: static;
    width: 100%;
  }
}
@media only screen and (max-width: 1023px) {
  .mainHeader .dropdownnav {
    left: auto;
    position: relative;
    top: auto;
    z-index: 100;
  }
  .mainHeader .dropdownnav > a {
    background-color: #8c1f37;
    height: 3.125em;
    position: relative;
    text-align: left;
    text-indent: -9999px;
    width: 3.125em;
    right: 0;
  }
  .mainHeader .dropdownnav > a:after {
    border: 2px solid #e8e8c0;
    content: '';
    left: 25%;
    position: absolute;
    right: 25%;
    top: 35%;
    top: 60%;
  }
  .mainHeader .dropdownnav > a:before {
    border: 2px solid #e8e8c0;
    content: '';
    left: 25%;
    position: absolute;
    right: 25%;
    top: 35%;
  }
  .mainHeader .dropdownnav > ul {
    display: none;
    height: auto;
    left: 0;
    position: absolute;
    right: 0;
    background: #8c1f37;
  }
  .mainHeader .dropdownnav > ul > li {
    float: none;
    width: 100%;
  }
  .mainHeader .dropdownnav > ul > li > a {
    height: auto;
    padding: 0 .833em;
    text-align: left;
    color: #e6e6e6;
  }
  .mainHeader .dropdownnav > ul > li > a:hover,
  .mainHeader .dropdownnav > ul > li > a:focus {
    color: #ffffff;
    background: #b62847;
  }
  .mainHeader .dropdownnav > ul > li:not( :last-child ) > a {
    border-bottom: 1px solid #4d111e;
    border-right: none;
  }
  .mainHeader .dropdownnav li ul {
    padding: 0;
    padding-top: 0;
    position: static;
    background: #b62847;
  }
  .mainHeader .dropdownnav li ul li a {
    border-top: 1px solid #771a2f;
  }
  .mainHeader .dropdownnav:not( :target ) > a:first-of-type {
    display: block;
  }
  .mainHeader .dropdownnav:target > a:last-of-type {
    display: block;
  }
  .mainHeader .dropdownnav:target > ul {
    display: block;
  }
}

[KATHYU]

puede poner el código del menú ??

[auroaff]

Hola, esta consulta se resolvió, agregando un width de 120px en esta area:

.mainHeader .dropdownnav > ul > li {
display: inline-block;
height: 100%;
text-align: left;
width: 120px;
vertical-align: text-top;

[KATHYU]

Gracias por informar