Stop <article> from resizing when content is deleted from the tag?

user_14824732 0
Viewed 36

I am a little stumped here. I am dividing up the content by topic on my single webpage to create several different pages. However, whenever I delete and moved content to a different page, the article (Or maybe it is a #wrapper problem) resized itself to where it's only big enough for two sentences and not the rest of the content I left on the home page. I do not want it to resize itself. I want it to remain the same size that it would have had I not deleted the extra text and images from it. If that makes sense. I really would appreciate any help!

This is my current article code:

<article>
    <img height="409" width="400" src="images/logo.png" alt="Band logo" class="floatright"/>
    <p>
        SOME TEXT HERE
    </p>
</article>

And this is the CSS for the article (including the wrapper):

article {
    padding-left: 2em;
    padding-right: 2em;
    padding-bottom: 2em;
    display: block;
}

#wrapper {
    background-color: #c3c3c3;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}
resize css html
1 Answers

Try to add a min-height or height (or min-width / width) property to the article like this:

article {
    min-height: 400px; /* Change this the minimum height */
    height: 400px; /* This is fixed height */
    padding-left: 2em;
    padding-right: 2em;
    padding-bottom: 2em;
    display: block;
}
user_147252390
Related