0
Я ищу, чтобы выровнять «всплывающее» меню моей навигационной структуры до правого края div. В настоящее время он «выскакивает» из div. Любые предложения о том, как это сделать?Правое выравнивание последнего навигационного меню всплывает с помощью CSS
\t .main-navigation {
\t background-color: #2f9fa8;
\t }
\t .subMenu li:hover > a {
\t color: #e3d174;
\t text-decoration: underline;
\t }
\t #GeneralInfo {
\t width: 160px;
\t padding-top: 5px;
\t padding-left: 20px;
\t }
\t #Registration {
\t width: 200px;
\t padding-top: 5px;
\t padding-left: 20px;
\t }
\t #ScientificPrograms {
\t width: 175px;
\t padding-top: 5px;
\t padding-left: 20px;
\t }
\t #SpecialEvents {
\t width: 110px;
\t padding-top: 5px;
\t padding-left: 20px;
\t }
\t #Careers {
\t width: 70px;
\t padding-top: 5px;
\t padding-left: 20px;
\t }
\t #Exhibits {
\t width: 90px;
\t padding-top: 5px;
\t padding-left: 20px;
\t }
\t .subMenu {
\t width: 200px;
\t }
\t #navMenu ul,
\t #navMenu {
\t list-style-type: none;
\t margin: 0;
\t padding: 0;
\t }
\t .nav > li > a {
\t display: block;
\t height: 100%;
\t color: #FFFFFF;
\t text-decoration: none;
\t padding: 0;
\t font-size: 14px;
\t font-weight: 800;
\t outline: none;
\t }
\t .nav > li > a:hover {
\t display: block;
\t height: 100%;
\t padding: 0;
\t color: #FFFFFF;
\t text-decoration: none;
\t background: #2f9fa8;
\t }
\t .nav > li {
\t padding: 0;
\t float: left;
\t height: 30px;
\t font-family: Arial, sans-serif;
\t font-size: 14px;
\t background-color: #2f9fa8;
\t }
\t .nav li {
\t position: relative;
\t }
\t .nav li > ul {
\t position: absolute;
\t display: none;
\t border-bottom: 0;
\t z-index: 9999;
\t }
\t .nav li > ul > li > a {
\t text-decoration: none;
\t color: #FFFFFF;
\t font-weight: 600;
\t display: block;
\t background: #2f9fa8;
\t text-shadow: none;
\t padding: 5px 3px 5px 10px;
\t text-indent: -7px;
\t }
\t .nav li:hover > ul {
\t display: block;
\t }
\t<nav class="main-navigation">
<ul id="navMenu" class="nav">
<li id="GeneralInfo"><a class="gradient" href="#">General Information</a>
<ul class="subMenu" id="sub-GeneralInfo">
<li><a href='#'>Annual Meeting</a>
</li>
<li><a href='#'>San Diego, CA</a>
</li>
<li><a href='#'>Supporters</a>
</li>
<li><a href='#'>Just for the Media</a>
</li>
<li><a href='#'>Volunteer</a>
</li>
<li><a href='#'>Awards and Fellowships</a>
</li>
<li><a href='#'>FAQs</a>
</li>
<li><a href='#'>Forms</a>
</li>
<li><a href='#'>Events and Maps</a>
</li>
<li><a href='#'>Meeting Requests</a>
</li>
<li><a href='#'>Visa Information</a>
</li>
<li><a href='#'>Transportation</a>
</li>
<li><a href='#'>Ride Share Program</a>
</li>
<li><a href='#'>Restaurants</a>
</li>
<li class='last'><a href='#'>Top Reasons to Attend</a>
</li>
</ul>
</li>
<li id="Registration"><a class="gradient" href="#">Registration & Housing</a>
<ul class="subMenu" id="sub-Registration">
<li><a href='#'>Online Registration</a>
</li>
<li><a href='#'>Registration Information</a>
</li>
<li><a href='#'>Housing Reservations</a>
</li>
<li class='last'><a href='#'>Room Share Program</a>
</li>
</ul>
</li>
<li id="ScientificPrograms"><a class="gradient" href="#">Scientific Programs</a>
<ul class="subMenu" id="sub-ScientificPrograms">
<!--<li><a href='#'>Submit a Session Proposal</a></li>-->
<li><a href='#'>Submit an Abstract</a>
</li>
<li><a href='#'>Mobile Event App</a>
</li>
<!--<li><a href='#'>Scientific Session Index</a></li>-->
<!--<li><a href='#'>Abstract Author Index</a></li>-->
<!--<li><a href='#'>Abstract Keyword Index</a></li>-->
<li><a href='#'>Continuing Education</a>
</li>
<li><a href='#'>Continuing Medical Education</a>
</li>
<li><a href='#'>Scientific Sessions</a>
</li>
<li><a href='#'>Thematic Approach</a>
</li>
<!--<li><a href='#'>Scientific ePosters</a></li>-->
<li class='last'><a href='#'>Presentation Instructions</a>
</li>
</ul>
</li>
<li id="SpecialEvents"><a class="gradient" href="#">Special Events</a>
<ul class="subMenu" id="sub-SpecialEvents">
<li><a href='#'>Outreach</a>
</li>
<li><a href='#'>Featured Sessions</a>
</li>
<li><a href='#'>Social Events</a>
</li>
<li><a href='#'>Student and Postdoc Scholar Events</a>
</li>
<li><a href='#'>Satellite Meetings</a>
</li>
<li><a href='#'>Meeting Requests</a>
</li>
<li class='last'><a href='#'>Virtual Global Gallery Posters</a>
</li>
</ul>
</li>
<li id="Careers"><a class="gradient" href="#">Careers</a>
<ul class="subMenu" id="sub-Careers">
<li><a href='#'>Career Sessions</a>
</li>
<li><a href='#'>Career Resources and Development Services</a>
</li>
<li class='last'><a href='#'>Job Bank</a>
</li>
</ul>
</li>
<li id="Exhibits"><a class="gradient" href="#">Exhibits</a>
<ul class="subMenu" id="sub-Exhibits">
<li><a href='#'>ToxExpo</a>
</li>
<li><a href='#'>Exhibitor Listing</a>
</li>
<li><a href='#'>Exhibitor-Hosted Session Application</a>
</li>
<li><a href='#'>Exhibitor-Hosted Sessions</a>
</li>
<li><a href='#'>Support Opportunities</a>
</li>
<li class='last'><a href='#'>Supporter Listing</a>
</li>
</ul>
</li>
</ul>
</nav>Вы можете финт его также в codepen
tks Pete! как я могу ответить на ваш ответ? – trevoray