水平内嵌对齐

我在名为mission的部分id内分配了h2和p元素。您可以在这里查看详细的代码http://jsfiddle.net/5Umm3/ 我经常遇到问题，以水平方向对齐两个元素。相反，他们开始垂直对齐，高度为45px，并且我希望h2元素，即任务在垂直中心对齐在45px高度的部分id任务和p id也垂直居中对齐在45px高度。 h2和p彼此水平对齐。另外我看到p有些粗体而没有给我粗体，在这种情况下它是否继承了前一个id的字体重量？感谢您的帮助提前。水平内嵌对齐

来源

2011-07-30 varun86

我想这是你所追求的：

使h2并在#mission的p并肩而坐。
删除p上的bold。

为了做到这一点，我添加display:inline-block;到h2和p两者。

h2也垂直对齐顶部。 Width被添加到两者。

而我删除bold与font-weight:normal;。

#mission h2{ 
    text-align:left; 
    font-family:Georgia, "Times New Roman", Times, serif; 
    font-size:22px; 
    font-weight:bold; 
    margin-left:40px; 
    color:blue; 
    display:inline-block; 
    width:200px; 
    vertical-align:top; 
} 
#mission p{ 
    font-family:Georgia, "Times New Roman", Times, serif; 
    font-size:14px; 
    margin-right:40px; 
    display:inline-block; 
    width:450px; 
    font-weight:normal; 
}

http://jsfiddle.net/jasongennaro/5Umm3/2/

来源

2011-07-30 13:55:15

谢谢杰森。这是我正在寻找的。 – varun86

乐意帮忙@ varun86！ –

我很好奇地试图理解你的问题是什么，但我无法追随它的大部分。尝试使用带有明确问题的简短句子，以问号结束提问。

以问号结尾的唯一一句话是问与p有大胆。如果你看一下在任何合理的调试器的HTML（类似Firebug或Chrome调试器），你可以看到，在p得到，因为这个CSS的大胆：由于p标签包含在任务部分中

#mission {font-weight: bold;}

，它被任务部分的任何设置所覆盖，除非您在本地覆盖更多的p格式。如果你想分别控制P，你可以使用CSS这样的：

#mission p {font-weight: normal;}

至于你写的比对所有的，我不明白你的问题是什么。请重新提出一个简单的问题，我们可以尝试提供帮助。

编辑： 还在猜测你想在这里，但如果你想在“团”称号的左边缘与它下面的文本的左边缘排队，然后取出指示线在这部分是什么你的CSS的：

#mission h2{ 
    text-align:left; 
    font-family:Georgia, "Times New Roman", Times, serif; 
    font-size:22px; 
    font-weight:bold; 
    margin-left:40px; // <---- Remove this line 
    color:blue; 
}

来源

2011-07-30 05:23:04 jfriend00

对此深感抱歉。那么，我想看看如何让p和h2水平对齐而不是现在的垂直对齐？谢谢你的帮助。 – varun86

我不明白。我看到“Mission”的标题，我看到一段文字后面出现“我们努力提供......”。你只是想让特派团向左移动，使其左边缘与文本对齐？如果是这样，请参阅上面我的答案中的第一个编辑，了解如何执行此操作。 – jfriend00

水平内嵌对齐

回答

相关问题