I have a page almost finished but I am having a small problem where I need to move the menu in the page down about 10 pixels. As hard as I try I cannot find the code to modify to move the menu down. Here is the code: can anybody help?
/* ------------ Menu ROOT ------------ */
.page-menu {
width: auto;
height: 35px;
margin: 3px 0 0 20px;
margin-top: 10px;
}
.menuwrapper {}
ul#primary-nav li hr.menu_separator{
position: relative;
visibility: hidden;
display:block;
width:1px;
height: 32px;
margin: 0px 5px 0px;
}
.page-menu ul#primary-nav {
height: 1%;
float: left;
list-style: none;
padding: 0;
margin: 0;
}
.page-menu ul#primary-nav li {
float: left;
}
.page-menu ul#primary-nav li a,
.page-menu ul#primary-nav li a span {
display: block;
padding: 0 10px;
background-repeat: no-repeat;
background-image: url(uploads/NCleanBlue/tabs.gif);
}
.page-menu ul#primary-nav li a {
padding-left: 0;
color: #000;
font-weight: bold;
line-height: 1.5em;
text-decoration: none;
margin-left: 1px;
font-size: 0.85em;
}
.page-menu ul#primary-nav li a:hover,
.page-menu ul#primary-nav li a:active {
color: #000;
}
.page-menu ul#primary-nav li a.menuactive,
.page-menu ul#primary-nav li a:hover span {
color: #000;
}
.page-menu ul#primary-nav li a span {
padding-top: 6px;
padding-right: 0;
padding-bottom: 5px;
}
.page-menu ul#primary-nav li a.menuparenth,
.page-menu ul#primary-nav li a.menuactive,
.page-menu ul#primary-nav li a:hover,
.page-menu ul#primary-nav li a:focus,
.page-menu ul#primary-nav li a:active {
background-position: 100% -120px;
}
.page-menu ul#primary-nav li a {
background-position: 100% -80px;
}
.page-menu ul#primary-nav li a.menuactive span,
.page-menu ul#primary-nav li a:hover span,
.page-menu ul#primary-nav li a:focus span,
.page-menu ul#primary-nav li a:active span {
background-position: 0 -40px;
}
.page-menu ul#primary-nav li a span {
background-position: 0 0;
}
.page-menu ul#primary-nav .sectionheader,
.page-menu ul#primary-nav li a:link.menuactive,
.page-menu ul#primary-nav li a:visited.menuactive {
/* @ Opera, use pseudo classes otherwise it confuses cursor... */
cursor: text;
}
.page-menu ul#primary-nav li span,
.page-menu ul#primary-nav li a,
.page-menu ul#primary-nav li a:hover,
.page-menu ul#primary-nav li a:focus,
.page-menu ul#primary-nav li a:active {
/* @ Opera, we need to be explicit again here now... */
cursor: pointer;
}
/* Additional IE specific bug fixes... */
* html .page-menu ul#primary-nav {
display: inline-block;
}
*:first-child+html .page-menu ul#primary-nav {
display: inline-block;
}
What does margin: 0px 5px 0px do? Which margin is which?
Re: What does margin: 0px 5px 0px do? Which margin is which?
The margin property can have from one to four values.
* margin:25px 50px 75px 100px;
o top margin is 25px
o right margin is 50px
o bottom margin is 75px
o left margin is 100px
* margin:25px 50px 75px;
o top margin is 25px
o right and left margins are 50px
o bottom margin is 75px
* margin:25px 50px;
o top and bottom margins are 25px
o right and left margins are 50px
* margin:25px;
o all four margins are 25px
* margin:25px 50px 75px 100px;
o top margin is 25px
o right margin is 50px
o bottom margin is 75px
o left margin is 100px
* margin:25px 50px 75px;
o top margin is 25px
o right and left margins are 50px
o bottom margin is 75px
* margin:25px 50px;
o top and bottom margins are 25px
o right and left margins are 50px
* margin:25px;
o all four margins are 25px
Re: What does margin: 0px 5px 0px do? Which margin is which?
If you look thru the default style sheets that come with cmsms you will find references to how this works, but I'll give them to you this time...
This is the same for padding or margin, this is assuming you have 4 numbers, I will give it in all variation starting with 4 numbers and working my way down...
0px 0px 0px 0px top right bottom left...
0px 0px 0px top right&left bottom...
0px 0px top&bottom right&left...
0px all sides...
This is the same for padding or margin, this is assuming you have 4 numbers, I will give it in all variation starting with 4 numbers and working my way down...
0px 0px 0px 0px top right bottom left...
0px 0px 0px top right&left bottom...
0px 0px top&bottom right&left...
0px all sides...