CODEWITHSUNDEEP
htmlcss
Nick Bull
Nick Bull

Reputation: 9866

How to wrap a div vertically only?

As the title says, I want to wrap a div vertically around an image, but I want the width to remain fluid and changeable:

|_________________|
|     |XXXXXX|    |
|     |XXXXXX|    |
|     |XXXXXX|    |
|     |XXXXXX|    |
|     |XXXXXX|    |
|     |XXXXXX|    |
|-----------------|

Where the box is the container and the content is the block of characters. The bottom and top sides should meet with the content block, I want the content to center (margin: 0 auto;).

Upvotes: 0

Views: 86

Answers (1)

leoMestizo
leoMestizo

Reputation: 1499

This is what you want? DEMO

Try resize the output section in the fiddle and you will see that the content will always be in the center.

Here's the CSS:

.container {
    height: 300px;
    text-align: center;
    background: #CCC;
}

.inner {
    height: 100%;
    width: 300px;
    display: inline-block;
    border: 1px solid black;
}

Upvotes: 2

Related Questions