Здравствуйте, не могу понять, как исправить вертикальное раскрывающееся css-меню.
Проблема в том, что при наведении на пункт, имеющий подпункты, субменю не просто вылезает справа, но и тащит за собой правую сторону обводки всего блока + раздвигает пространство между первым и вторым пунктами.
You can post now and register later.
If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.
Здравствуйте, подскажите какой тег использовать для увеличения значения, пример на картинке.
Вроде, про такой тег я слышала. Если есть тег прогресс бар, значит и такое должно быть.
Question
Codename
Здравствуйте, не могу понять, как исправить вертикальное раскрывающееся css-меню.
Проблема в том, что при наведении на пункт, имеющий подпункты, субменю не просто вылезает справа, но и тащит за собой правую сторону обводки всего блока + раздвигает пространство между первым и вторым пунктами.
Прилагаю скриншоты до и после наведения мыши.
Код CSS
#blocks {display: table-cell; width: 20%; background-color: #e9e9e9;-webkit-box-shadow: 2px 3px 4px 0px rgba(50, 50, 50, 0.75);-moz-box-shadow: 2px 3px 4px 0px rgba(50, 50, 50, 0.75);box-shadow: 2px 3px 4px 0px rgba(50, 50, 50, 0.75);outline: 3px solid #8c3200;} .block-top {min-height: 44px; height: auto; width: auto;background-color: #5b2100;outline: 3px solid #8c3200;-webkit-box-shadow: 1px 5px 5px 0px rgba(50, 50, 50, 0.75);-moz-box-shadow: 1px 5px 5px 0px rgba(50, 50, 50, 0.75);box-shadow: 1px 5px 5px 0px rgba(50, 50, 50, 0.75);padding: 0px; 0px; 0px; 0px;margin: 0;}.block-top-text {font-size: 26px;font-weight: bold;font-family: Arial;text-align: center;padding: 10px 0% 10px 0%;color: #8c3200;} .block-menu {width: auto;padding: 0px 0px 0px 0px;font-family: Arial;font-size: 20px;color: #8c3200;}.block-menu ul {list-style-type: none;margin: 0;padding: 0px 0px 0px 4px;} .block-menu ul li {border-bottom: 1px dotted #8c3200;} .block-menu a {font-family: Arial;font-size: 20px;color: #8c3200;text-decoration: none;}.block-menu a:hover {color: #AD704E;} .block_sub1 li ul li {display: none;position: absolute;left: 210px;top: -40px;}.block_sub1 li:hover ul li {display: block;position: relative;background-color: #AD5A2B;}
Код html
Описание структурных элементов
Прошу прощения за большие картинки, не знаю, как прикрепить.
Очень надеюсь на помощь.
Link to comment
Share on other sites
14 answers to this question
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.