Text/image combination - how to

I saw this design on a page on the net:

  • The image column and text column overlap horizontally.
  • The text column starts vertically lower than the image column.

Can I somehow achieve this layout with the Bootstrap tools (Row, Cols)? Is it possible with existing classes? Can anyone help me here?

Thank you all.
Greetings Reto

You can do it by using standard columns (in this case two, set with a class of col-md-6)

In the second column add a div with class of textbox

Add the following to your css

@media (min-width: 768px) {
  .textbox {
    margin-top: 10rem;
    margin-left: -5rem;
    padding: 3rem;

The media query is set so that below 768px width the textbox will be a standard vertical stack.

Example here:



@richards Wow, thank you. Its exactly that, that i need. WOW.

1 Like