0

我有两个 div 在浏览器中预览时它们之间有很大的差距。

代码:

<div id="title-1">
        <p>XXX is pleased to announce the launch of our Social Enterprise - Experience Us</p>
    </div>
    <div id="maindescription-1">
        <p>XXX are conducting unique tours to celebrate us, the beating heart of our culture in Scotland.  We will be 
        taking people on a journey through Glasgow, Scotland on a guided tour about the stories of the locals and pioneers that
        made Glasgow what it is today, and then expanding the experiences with tasting tours of the variety of delicious cuisines
        on offer.  Please see below for more information:</p>

CSS:

#title-1 {
    font: normal normal bold 100% "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif;
    float: left;
    width: 850px;
    padding: 10px;
    color: #FFFF00;
    text-align: justify;
    vertical-align: baseline;
}
#maindescription-1 {
    font: 100% "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif;
    float: left;
    width: 850px;
    padding: 10px;
    color: #FFFFFF;
    text-align: justify;
    vertical-align: baseline;
}

如何解决这个问题?

4

3 回答 3

2

您可以使用重置来防止浏览器默认设置偷偷摸摸。我喜欢 Eric Meyer 的重置: http ://bkaprt.com/rwd/9/

于 2012-10-09T06:01:48.067 回答
0

只需调整元素的边距和填充(默认情况下在每个浏览器上应用不同)<p>

例如

p {
    margin : 1em 0 0 0; // or 0
    padding : 0;
}
于 2012-09-21T12:44:34.893 回答
0

首先你需要关闭最后一个 div

    <div id="title-1">
            <p>XXX is pleased to announce the launch of our Social Enterprise - Experience Us</p>
        </div>
        <div id="maindescription-1">
            <p>XXX are conducting unique tours to celebrate us, the beating heart of our culture in Scotland.  We will be 
            taking people on a journey through Glasgow, Scotland on a guided tour about the stories of the locals and pioneers that
            made Glasgow what it is today, and then expanding the experiences with tasting tours of the variety of delicious cuisines
            on offer.  Please see below for more information:</p>    
</div>

你应该将 p 的边距设置为 0

p 
{
    margin : 0;
}
于 2012-09-21T12:46:53.517 回答