Deplasare Secondary_Navigation După Adăugare Boarder

[+duL @]

Salut.

Am adăugat boarder-top si boarder-bottom meniului , si dupa adaugarea boarderului , secondary_navigation s-a deplasat la dreapta exact pana unde se termina meniul.

 

poza:

 

Ce modificări trebuie sa fac pentru a-l aduce in stanga ?

 

CSS:

#community_app_menu > li > a {

color: #9a9a9a;

background: url("{style_images_url}/trans10.png") repeat;

background: rgba(0,0,0,0.1);

                border-left: 1px solid #272727;

                border-right: 1px solid #272727;

                border-top: 2px solid #bc1111;

                border-bottom: 2px solid #bc1111;

display: block;

outline: none;

padding: 0px 15px;

line-height: 50px;

height: 50px;

position: relative;

-webkit-transition:width 0.2s, height 0.2s, -webkit-transform 0.2s;

-moz-transition:width 0.2s, height 0.2s, -moz-transform 0.2s;

-o-transition:width 0.2s, height 0.2s, -o-transform 0.2s;

transition:width 0.2s, height 0.2s, transform 0.2s;

}

#community_app_menu > li > a:hover,

#community_app_menu > li > a.menu_active {

background: url("{style_images_url}/trans30.png") repeat;

background: rgba(0,0,0,0.3);

color: #bc1111;

-webkit-transition: all 1s ease;

     -moz-transition: all 1s ease;

       -o-transition: all 1s ease;

      -ms-transition: all 1s ease;

          transition: all 1s ease;

      webkit-filter:#bc1111(100%);

}

#community_app_menu > li.active > a {

background: url("{style_images_url}/trans50.png") repeat;

background: rgba(0,0,0,0.5);

color: #bc1111;

}

 

#primary_extra_menucontent,

#more_apps_menucontent, .submenu_container {

background: url("{style_images_url}/trans80.png") repeat; background: rgba(20,20,20,0.9);

font-size: 12px;

border: 0;

min-width: 140px;

-webkit-box-shadow: none;

-moz-box-shadow: none;

box-shadow: none;

-moz-border-radius: 0 0 4px 4px;

-webkit-border-bottom-right-radius: 4px;

-webkit-border-bottom-left-radius: 4px;

border-radius: 0 0 4px 4px;

}

 

#primary_extra_menucontent li,

#more_apps_menucontent li, .submenu_container li {

padding: 0;

border: 0;

background: none transparent;

float: none !important;

min-width: 150px;

}

 

#primary_extra_menucontent a,

#more_apps_menucontent a, .submenu_container a { 

display: block;

padding: 8px 10px;

color: #fff;

}

 

#primary_extra_menucontent a:hover,

#more_apps_menucontent li:hover a, .submenu_container li:hover a { background: url("{style_images_url}/transw10.png") repeat; background: rgba(255,255,255,0.06); color: #fff; }

 

#community_app_menu .submenu_container { width: 260px; }

#community_app_menu .submenu_container li {width: 260px; }

 

#primary_extra_menucontent li:last-child a,

#more_apps_menucontent li:last-child a{

-moz-border-radius: 0 0 4px 4px;

-webkit-border-bottom-right-radius: 4px;

-webkit-border-bottom-left-radius: 4px;

border-radius: 0 0 4px 4px;

}

 

#secondary_navigation{

background: #1d1d1d url('{style_images_url}/secondary_nav_bg.png') repeat-x 0 0;

overflow: hidden;

line-height: 37px;

}

 

#secondary_navigation a{

color: #fff;

line-height: 37px;

height: 37px;

}

 

#secondary_navigation a:hover{ color: #fff; }

 

#secondary_navigation #breadcrumb li {

float: left;

}

 

#secondary_navigation #breadcrumb li a {

padding-left: 12px;

;

background: url('{style_images_url}/seconday_nav.png') no-repeat 0 0;

display: block;

outline: none;

text-decoration: none;

}

 

#secondary_navigation #breadcrumb li.first a{

margin-left: 0;

background: none;

padding-left: 0px;

}

 

#secondary_navigation #breadcrumb li span{

display: block;

padding-right: 17px;

padding-left: 4px;

background: url('{style_images_url}/secondary_nav.png') no-repeat 100% 0;

}

 

#secondary_navigation #breadcrumb li > span{ padding-left: 4px; background: none transparent; color: #fff; }

 

#secondary_navigation #breadcrumb li.first a span{

padding-left: 12px;

}

 

#secondary_navigation #breadcrumb li a:hover{

background-position: 0 -43px;

}

 

#secondary_navigation #breadcrumb li a:hover span{

background-position: 100% -43px;

}

 

#secondary_navigation #breadcrumb li a:active{

background-position: 0 -86px;

}

 

#secondary_navigation #breadcrumb li a:active span{

background-position: 100% -86px;

}

 

Ce modificari trebuie să fac ?

[+duL @]

Up.

[gadeas]

Incearca sa adaugi la elementu care ai dat borderu urmatoru rand:

box-sizing: border-box;

Problema pare sa fie din cauza ca depaseste inaltimea cu borderu ala ce ai adaugat si de aia automat sare bucata de sub in lateral pentru ca nu mai are loc.

[+duL @]

Stimă şi respect Gadeas.

Rezolvaţa.

Mulţumesc.