No replies
web_editor
web_editor's picture
Offline
newbie
Last seen: 5 years 28 weeks ago
Timezone: GMT+8
Joined: 2014-05-28
Posts: 2
Points: 4

Hi! I’m new in css and i’m building now my first website. I want to center the menu and footer bar? Not only the text, but the whole nav bar. And how to adjust the alignment of footer bar, I mean how to move in slightly top of the bottom of the page? Pls help me. Thank you!

Here’s the script of menu bar css:

.main-navigation {
    clear: both;
    display: table;
    font-weight: 300;
    font-family: 
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    position: relative;
    text-align: center;
    border-bottom: 3px solid #e92121;
    background: #ff0000;
    height: 43px;
    width: 80%;
}
.main-navigation .ak-container{
    padding:0 !important;
}
.main-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.main-navigation li {
    display: inline-block;
    position: relative;
    line-height:43px;
    font-size:18px;
    text-transform: initial;
    color:#ababab;
    white-space: nowrap;
}
.main-navigation.menu-right{
    text-align: right;
}
.main-navigation.menu-center{
    text-align: center;
}
.main-navigation.menu-right li{
    margin-left: 25px;
    margin-right:0;
}
.main-navigation.menu-center li{
    margin-left: 12px;
    margin-right:12px;
}
.main-navigation a {
    display: block;
    text-decoration: none;
    color: #FFF;
    padding: 0 18px
}
.main-navigation ul ul {
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    position: absolute;
    z-index: 99999;
    background: #FFF;
    top: 100%;
    border-bottom: 3px solid #e92121;
    border-top: 3px solid #e92121;
    transition:all 0.3s ease-in-out;
    -moz-transition:all 0.3s ease-in-out;
    -webkit-transition:all 0.3s ease-in-out;
}

Here’s the link of footer bar css:

#bottom-footer{ 
    background: #E8E8E8;
    padding: 0px 0 0 0;
    text-transform: initial;
    font-family: Arial, Helvetica, sans-serif;
    height: 31px;
    min-height: 1px;
    position: relative;
        font-weight: 300;
    width: 80%;
    text-align: center;
    font-size: 11px;
    margin: 20px 0 20px;
    color: #969696;