<h1>The calc() Function</h1>

<p>Create a div that stretches across the window, with a 300px gap between both sides of the div and the edges of the window:</p>

<div id="div1">Some text...</div>
#div1 {
  position: absolute;
  left: 150px;
  width: calc(100% - 300px);
  border: 1px solid black;
  background-color: yellow;
  padding: 5px;
  text-align: center;
}
h1{
  text-align: center;
}
p{
  text-align: center;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.