Html IE内部元素字体大小更改时文本缩进出现问题

我正在用一系列引号设计一个页面的样式。每个报价的格式如下：

<blockquote>
<span class="ldquo">&ldquo;</span>The quote<span class="rdquo">&rdquo;</span>
<cite>The author</cite>
</blockquote>

以前有没有人见过这个问题，可以帮我解决？

---

谢谢。

你试过用左边填充代替文本缩进吗？对于blockquote，请使用1em的左边填充，并将.ldquo更改为“left”仅为-0.2em

尝试以下操作。不确定它是否可以跨浏览器工作-可能需要对IE进行奇怪的调整（我是说什么不可以，对吗？），但它在Chrome中工作良好，因此应该可以完美地在Opera和FF中工作。你可能想调整宽度等，但它做你想做的

新解决方案（报价下无缩进）

&ldquo；

fdfsdf ldsfj dsfjds lfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf FDSFJ dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjdsldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf FDFSF ldsfj dsfjds lfsdfdsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj ldsfj dsfjds lfsdf LDSFF ldsfj dsfjds lfsdflfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf

&rdquo；

旧解决方案

<div style="position: relative;">
    <span style="float: left; width: 20px; height: 20px; font-size: 3em; margin-top: -0.25em; margin-left: 0; margin-right: 5px;">&ldquo;</span>
    <p style="margin-left: 25px; margin-right: 25px; text-align: justify;">
        fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf
    </p>
    <span style="float: right; width: 20px; height: 20px; font-size: 3em; margin-top: -1em;">&rdquo;</span>
    <div style="clear: both;"></div>
</div>

&ldquo；

fdfsdf ldsfj dsfjds lfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf FDSFJ dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjdsldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf FDFSF ldsfj dsfjds lfsdfdsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj ldsfj dsfjds lfsdf LDSFF ldsfj dsfjds lfsdflfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf

&rdquo；

好的。我想我找到了一个解决方案来修复布局，不幸的是没有找到bug

我删除了文本缩进，而是在

ldquo

中添加了一个适当的右边距，然后向左浮动。由于

ldquo

的高度为零，这使我回到了原始状态，文本位于引号上方。但增加1倍的最小高度，修复了这一问题，祈祷成功

这是最后的CSS

#container {
    width: 20em;
}

blockquote {
    margin :0 0 2em 0;
    position:relative;
    font-size:0.7em;
    text-align:justify;
}

.ldquo, .rdquo {
    color: #EC008C;
    font-size:3em;
    height:1px;
    top: -0.15em;
    position:relative;
}

.ldquo {
    float:left;
    margin-right:0.14em;
}

.rdquo {
    float:right;
    left: 0.05em;
}   

blockquote cite {
    display:block;
    font-weight:bold;
    text-indent:0;
}

---

谢谢你。是的，它没有表现出与填充相同的问题行为，不幸的是，它也没有提供我想要的效果，我真的只希望第一行缩进。如果我找不到另一个解决方案，这可能是我不得不做出的妥协。虽然它可能不理想，但至少是统一的。我还没有阅读所有代码，但我感觉，正如您在结尾的引号中使用的

float:right

，第一个应该可以使用

float:left

。这样，文本将环绕引号跨度。只是一个想法。“让我知道它是否有效，我会把它作为一个答案，让你去标记。”克拉克男孩。谢谢你的意见。是的，我刚刚用

float:left找到了一个解决方案我认为应该这样做。我以前试过一些，但它不起作用，但我想也许我留下了一些我不应该有的东西，那就是打破它。不管怎么说，我现在在家，家里唯一的windows电脑有人，所以我现在还不能检查，但我检查完后会给你回复。当然，可能是你在使用naff浏览器！：）我是说，我是说。。。我想说的版本，但我认为“所有的”应该涵盖它lol。我认为FF 2是相当过时的现在，和歌剧之前9。我相信Chrome会自动更新，所以你在那里很安全。“不能说我还试过其他的。”克拉克男孩。我同意IE。但问题不是我使用的是naff浏览器，而是很多其他人都在使用，尽管很不幸，我们必须支持他们。说得好。但据报道，我们不必再支持它了。在过去3年里，IE每年下降8%。按照这个速度，到2015年它将达到0。好吧，这么说是不现实的，因为IE永远不会停止使用。我知道这些统计数据主要基于网络开发者，但这仍然是一个好迹象。可能是越来越多的开发人员对IE感到厌倦，以至于
<div style="position: relative;">
    <span style="float: left; width: 20px; height: 20px; font-size: 3em; margin-top: -0.25em; margin-left: 0; margin-right: 5px;">&ldquo;</span>
    <p style="margin-left: 25px; margin-right: 25px; text-align: justify;">
        fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf fdfsdf ldsfj dsfjds lfsdf
    </p>
    <span style="float: right; width: 20px; height: 20px; font-size: 3em; margin-top: -1em;">&rdquo;</span>
    <div style="clear: both;"></div>
</div>

#container {
    width: 20em;
}

blockquote {
    margin :0 0 2em 0;
    position:relative;
    font-size:0.7em;
    text-align:justify;
}

.ldquo, .rdquo {
    color: #EC008C;
    font-size:3em;
    height:1px;
    top: -0.15em;
    position:relative;
}

.ldquo {
    float:left;
    margin-right:0.14em;
}

.rdquo {
    float:right;
    left: 0.05em;
}   

blockquote cite {
    display:block;
    font-weight:bold;
    text-indent:0;
}