user3848889
user3848889

Reputation: 67

Vertically align content inside a grid of div tags

Im making a grid with div tags to put different types of content in there like pictures, text, headings, buttons etc. I tried atleast 3 different ways to make a grid and now i finally found the best way for me. The grid now is looking good and works perfect, however i have 1 problem, i cannot align 1 text to the bottom.

Now for my question:

How do i align the call-to-action text at the bottom of the div while keeping the rest of the content at the top. I would like to be able to do this by just adding some rules instead of taking a whole different approach by building the grid.

The part that should be aligned at the bottom is called "Bekijk dit artikel".

All suggestions are very welcome!

Upvotes: 1

Views: 118

Answers (2)

user3073234
user3073234

Reputation: 771

Check out CSS Position properties http://www.w3schools.com/cssref/pr_class_position.asp You should be able to provide your text with an absolute position.

Upvotes: 1

pavel
pavel

Reputation: 27092

Use positioning here.

.blok3-a {position: relative;}
.text-container-link {position: absolute; left: 0; bottom: 0;}

http://jsfiddle.net/AL6Qn/2/

If you don´t know height of content above, there is no other way using your HTML and align text only with CSS.

Upvotes: 1

Related Questions