I am looking for a way to create a div in html whose width is 100% of the screen and not cut off at the width defined by the parent container. Something like a horizontal stripe to place a newsletter subscription form.
I have tried with:
.contenedor_newsletter{
margin-left: -100%;
margin-right: -100%;
}
And although he catches it well on the left, on the right he always leaves a piece unfilled. Is there a way to do this break from the parent container?
EDIT: I add an image of what I'm trying to do:
The red lines would be the width of the main container. The blue lines would be the total width of the screen. You can see how on the right margin it leaves a small piece unfilled with the css rules that I have indicated before.
Pdta: the form that you see on the left, I would center it later. What interests me is to show a strip of color (right now it's pink) surrounding said form, as a cut between the post and the comments of the entry.
I don't know if this code that occupies the entire visible width of the browser can help you. Then you center it by putting a smaller size and left: whatever
One solution is to put your "main" box a position
relativa
and your "daughter" box where that form will come put it asabsoluta
Once that to the "daughter" box you manipulate its position without fear that it will leave the parent box.
I do it this way:
HTML:
CSS:
At the end put an
overflow:hidden
al body in case the DOM box comes out