How to: Make DIV break out of grid on one side

Design help General
1

Hey!

I have problems positioning a div like so:

34
341540×742 4.58 KB

The black div should always go to the border of the viewport, regardless the size.
I was trying to do this with overflow, but I cant manage to only affect one side.

Thanks!!

2

Hello @maartin

Can you share your read only link please?

3

Hey, I can’t really share it, and I’m on two projects only so cant make new project with only this section.

I currently only have a centered max-width DIV with fixed height.

4

Hey, just wanted to follow up with a solution I found @aaronocampo . The keyword I needed was ‘bleed’.

  1. Make a DIV, set the width of the grid and center it.
  2. Add another div, set width to 100%, float:left and padding right to 9999.
  3. Put everything into a new DIV under body and set the overlay to none.

The outcome is what is shown on the image above minus the text.

The only thing bugging me now, is how to put a new DIV on top(so I can put text there), with width of the grid. Right now, I have a new div under it and position:relative and pushed above.