Im posting this message in hopes to find the best way to do what I need to do. What i'm trying to do is use the normal grid, lets say a 6 and 6 and one half is normal text/content that will stay within the grid, the second half would just be a image. BUT I want that image to take up the full width and height of the second half all the way to the edge of the browser. I will attach a image to show you exactly what I mean.
This is a sample of what i'm looking for. The text needs to stay within the grid but the image needs to break out. I have tried to use the grid off-set feature for the text block and set the row to "expand" to take up full width but it does not line up with the grid above and below. Another image to see what I mean.
Any ideas on the best way to get this look using the build in grid system with foundation?