修改我的 CSS div 的动态 Web 模板？

Question

我一直在四处搜索，试图找到一些关于我在使用 Microsoft Expressions Web 4 时遇到的奇怪行为的信息，并利用它们的内置动态 Web 模板 (DWT) 功能。

每当我更新我的 DWT 时都会遇到问题，如果我选择这样做，它反过来会更新它所附加的页面。自然，当我修改页眉或导航菜单时，我希望所有页面都使用新信息进行更新。效果很好，附加到模板的所有页面都会相应更新，但是对我的 CSS 进行了一些其他更改。

这是交易：每次我更新 DWT，我的索引页面也会更新。通常，这很好，但它不断改变我的<div id="post"> 标签。假设我的索引上有五个<div id="post">。如果我更新 DWT，它们将如下所示：

<div id="post">

<div id="post0">

<div id="post1">

<div id="post2">

<div id="post3">

您可以猜到，之后我的 CSS 看起来不一样了，因为我的 post div 中只有一个会保持活动状态。其他的都附加了一个数字，格式被破坏了。然后我需要返回并删除最后的每个数字。

最初，我在使用这些 DWT 时遇到了很多问题，它们基本上是重写整个页面，在 div 中添加 div，完全是意大利面。我发现，或者至少，将其归咎于我的 HTML 有点乱，并更改了很多标签，这样表情网络就不会乱了。

我的帖子 CSS 如下所示：

article, #post { width:auto; padding:5px; border: 1px #A9E8DB groove; background-color:whitesmoke; overflow:auto; margin-bottom:10px; }

在我的可编辑区域内，即我在 DWT 中指定的可在模板外编辑的页面区域内，我的 HTML 如下所示：

<div id="rightcolumn">
    <h2>BlahBlah.</h2>
    <br />
    <div id="post">

            Foo

    </div>
    <br />
    <hr /><br />
    <br />
    <div id="post">

            Foo

    </div>
    <br />
    <hr /><br />
    <div id="post">

            Foo

    </div>
    <br />
    <hr /><br />
    <div id="post">

            Foo

    </div>
    <br />
    <hr /><br />
    <div id="post">

            Foo

    </div>
    <br />
    <hr /><br />
    <div id="post">

            Foo

    </div>
    <hr /></div>

我希望我对我的问题足够清楚，并且如果人们认为有必要可以提供更多代码，我不想用任意信息压倒（尽管不多）。

我希望你们可以就这个问题分享一些见解，也许我不是第一个体验它的人？我感觉这与我的 HTML 编写方式有关，这可能不是最佳实践。我没有看到任何未关闭的标签，也没有看到任何重复的标签或任何类似的东西。页面可以正确呈现，并且看起来与我期望的 GUI 一样。

有什么想法吗？

Answer 1

我不知道你的工具。 ID 必须是唯一的。 但也许你可以处理：

<div class="post">

和

.post {
    width:auto;
    padding:5px;
    border: 1px #A9E8DB groove;
    background-color:whitesmoke;
    overflow:auto;
    margin-bottom:10px;
    }