html - 在 CSS 中对齐容器

Question

不幸的是，我对 CSS 的了解相当有限，我目前有一个主题，尽管我想要右手边的标题，例如Contact 和 About 靠右对齐，这样两个标题将始终显示在页面的右侧。

如有任何帮助，我将不胜感激，我已经在 CSS 中确定了容器 - “正确”

模板位于此处:

http://themeforest.net/item/cleanfolio-dark/22659

CSS 代码:

body {
    background: url(../images/bg.png) repeat;
    font: 12px Arial, Helvetica, Sans-Serif;
    padding: 0;
    margin: 0;
}

#container {
    width: 1165px;
}


/* ---- Standard Elements ---- */

a {
    color: #BBBBBB;
    text-decoration: none;
}

a:hover {
    color: #FFFFFF;
    text-decoration: none;
}

a:visited {
    text-decoration: none;
}

a:active {
    color: #FFFFFF;
    text-decoration: none;
}

h1, h2, h3, h4, h5 {
    font-family: Arial, Helvetica, Sans-Serif;
    font-weight: bolder;
    color: #FFFFFF;
    padding: 0;
    margin: 0px 0px 0px 0px;
}

h1 { font-size: 36px; }
h2 { font-size: 30px; }
h3 { font-size: 24px; }
h4 { font-size: 18px; }
h5 { font-size: 16px; }

p {
    line-height: 1.8em;
    padding: 0;
    margin: 0 0 5px 0;
}


/* ---- Header ---- */

#header {
    background: url(../images/blue/header_bg.png) repeat-x;
    height: 130px;
}

.header_title {
    float: left;
    background: url(../images/blue/header_titlebg.png);
    width: 370px;
    height: 110px;
    padding: 20px 0px 0px 30px;
}

.header_title h1 {
    font-size: 47px;
    font-weight: bolder;
    color: #FFFFFF;
    padding: 0;
    margin-bottom: -4px;
}

.header_title span {
    font-size: 10px;
    color: #71b3f0;
}


/* ---- Left Side Elements ---- */

#left {
    float: left;
    width: 840px;
    margin-right: 25px;
}

.portfolio_section-top {
    background: url(../images/topdivider.png) no-repeat;
    width: 790px;
    height: 280px;
    padding: 30px 10px 0px 30px;
}

.portfolio_section {
    background: url(../images/divider.png) no-repeat;
    width: 790px;
    height: 280px;
    padding: 30px 10px 0px 30px;
}

.portfolio_section-top img, .portfolio_section img {
    background: #111111;
    padding: 15px;
    border: 1px solid #222222;
}

.portfolio_section-top h1, .portfolio_section h1 {
    margin-bottom: 5px;
}

.portfolio_section-top small, .portfolio_section small {
    font: 10px Arial, Helvetica, Sans-Serif;
    color: #666666;
    text-transform: uppercase;
    line-height: 2em;
}

.portfolio_section-top p, .portfolio_section p {
    font: 12px Arial, Helvetica, Sans-Serif;
    color: #999999;
    margin-top: 10px;
    line-height: 1.8em;
}

.button_bg {
    background: url(../images/blue/button_bg.png) repeat-x;
    height: 14px;
    font: 10px Arial, Helvetica, Sans-Serif;
    color: #FFFFFF;
    text-transform: uppercase;
    padding: 5px 10px 5px 10px;
}

.tdmarginright td {
    padding-right: 30px;
}

.tdmarginright2 td {
    padding: 10px 17px 0px 0px;
}

.footer {
    margin-left: 30px;
    color: #666666;
}


/* ---- Right Side Elements ---- */

#right {
    float: right;
    width: 300px;
    margin-top: 30px;
}

.sidebar_title {
    background: url(../images/sidebar_titlebg.png);
    width: 283px;
    height: 38px;
    padding: 12px 0px 0px 17px;
}

.sidebar_bg {
    background: url(../images/sidebar_bg.png) repeat-y;
    width: 268px;
    color: #666666;
    padding: 0px 15px 15px 17px;
}

.sidebar_bottom {
    background: url(../images/sidebar_bottom.png) no-repeat;
    width: 300px;
    height: 1px;
    margin-bottom: 30px;
}

Answer 1

不知道这是否太明显了，但是——

CSS 看起来不错， 请注意它是#right——而不是 .right——所以很明显在你的 html 中你将使用 div id 而不是 div class