如何修复这个区域的高度？

Question

我在使用此fancy JQuery plugin开发的基于Web的应用程序中添加了一些引号和短消息。一切正常，但现在的问题是修复显示引用或消息的区域。我希望这个区域的高度固定，而不是可扩展。

怎么做？

HTML：

<div id="wrapper">
            <div id="article">

                <blockquote>
                    <p>Accidents hurt – safety doesn’t.</p>
                    <cite>&ndash; Unknown Author</cite>
                </blockquote>
                    </div>
</div>

CSS：

#wrapper { width: 300px; margin: 1px auto; }    
blockquote p { margin-bottom: 10px; font-style: italic; }
blockquote cite { font-style: normal; display: block; text-align: right; text-transform: uppercase; font-size: 10px; font-weight: bold; letter-spacing: 1px; font-family: Arial, Helvetica, sans-serif; }

/*
 |  Setting the width for the blockquotes is required
 |  to accurately adjust it's contianer
*/

blockquote {
    font-family: Georgia, Times, serif;
    width: 250px; /* required */
    margin: 0 auto;
    }

/*
 |  The #quote_wrap div is created
 |  by Quovolver to wrap the quotes
*/

#quote_wrap { 
    background: #fbffec 20px 20px;
    margin: 13px 0 0 0; 
    padding: 20px; 
    border: 1px solid #edffaf; 
    }

JavaScript的：

<script type="text/javascript" src="js/jquery.quovolver.js"></script>

        <!-- JavaScript Test Zone -->
        <script type="text/javascript">
            $(document).ready(function () {

                $('blockquote').quovolver();

            });
        </script>

编辑： 我想修复，因为如果我有一个很长的消息或引用，它将被扩展，这将导致扩展网站的页面，如下所示：

如果消息很短，以下区域将是这样的？：

新更新：

以下css属性修复了问题：

height:100px!important;

但现在它扰乱了框内报价的组织。例如，如果消息很短，则它将位于框的顶部。如果它很长，它将居中，这就是我想要的所有消息，无论是长还是短。 那怎么做？

Answer 1

.widget_content {
height: 150px !important; /* Or however high you want the div to be */
}

这将阻止div改变高度，我认为这就是你的意思。

“150px”可以更改为你想要div的高度。

.widget_content {
overflow: hidden;
}

这会切断任何超过您之前指定的高度的引号。 （如果你确保所有的引号足够小以适应你之前指定的高度div，你不应该需要它，这只是以防万一。）