вопрос
Вечер добрый.
Нужно сделать подчеркивание пунктиром ссылок в верхнем меню. Однако когда использую известный всем border-bottom: 1px dashed ..., то все ссылки подчеркиваются одной сплошной пунктирной линией, а как сделать так, чтобы каждая ссылка имела свое подчеркивание?
Сейчас стоит стандартное подчеркивание и оно отображается как следует.
Код CSS:
Нужно сделать подчеркивание пунктиром ссылок в верхнем меню. Однако когда использую известный всем border-bottom: 1px dashed ..., то все ссылки подчеркиваются одной сплошной пунктирной линией, а как сделать так, чтобы каждая ссылка имела свое подчеркивание?
Сейчас стоит стандартное подчеркивание и оно отображается как следует.
Код CSS:
/*topmenu*/
.topmenu { padding-top: 0px; margin-top: 17px; height: 33px; }
#topmenu { display: inline; }
#topmenu li a, #topmenu li a b, #topmenu li { float: left; height: 33px; }
#topmenu li a, #topmenu li a b { background: url("../images/topmenu.png") no-repeat 0 -999px; }
#topmenu li a { text-decoration: none; font-size: 1.15em; line-height: 33px; color: #333; }
#topmenu li a b { font-size: 14px; font-weight: normal; cursor: pointer; padding: 0 9px; text-decoration: underline; }
#topmenu li a:hover { background-color: #ffba00; background-position: 0 0; }
#topmenu li a:hover b { background-position: 100% -33px; text-decoration: none; }
#topmenu li a.selected { background-color: #ffba00; background-position: 0 -66px; }
#topmenu li a.selected b { background-position: 100% -99px; }
.submenu { overflow: hidden; margin: -1px 0 0 0; padding: 9px 0; background: #ffba00; position: absolute; top: 0; z-index:999; width: 220px; visibility: hidden;
-webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px;
-moz-border-radius-topleft: 0; -webkit-border-top-left-radius: 0; border-top-left-radius: 0;
}
.submenu ul { border-top: 1px solid #e0a300; border-bottom: 1px solid #ffd82d; }
.submenu a { background: url("../images/lines.png") no-repeat 0 -999px; border-bottom: 1px solid #e0a300; border-top: 1px solid #ffd82d; font-weight: bold; width: 100%; padding: 4px 0; display: block; text-indent: 12px; text-decoration: none !important; color: #333; font-size: 12px; }
.submenu a:hover { background: #ffc732 url("../images/lines.png") repeat; }
Вы видимо не туда писали стиль, попробуйте это:
Если та же ситуация, значит нужно переписывать стили.
#topmenu li a {border-bottom:dashed;}Если та же ситуация, значит нужно переписывать стили.
