HTML for adding a "Rule of Thirds" grid to webpages

RuleOfThirds.html

<div id="third_grid" style="
    /* background-color: black; */
    position: static;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index: 9999;
">
  <div id="vertical_1" style="
    background-color: black;
    width: 10px;
    position: fixed;
    top: 0px;
    left: 33%;
    /* right: 33%; */
    bottom: 0px;
    z-index: 9999;
"></div>
  <div id="vertical_2" style="
    background-color: black; width: 10px; 
    position: fixed; top: 0px; 
    /* left: 33%; */ 
    right: 33%; bottom: 0px; z-index: 9999;
"></div>
   <div id="horizontal_1" style="
    background-color: black;
    height: 10px;
    position: fixed;
    top: 33%;
    left: 0px;
    right: 0px;
    /* bottom: 0px; */
    z-index: 9999;
"></div>
  <div id="horizontal_2" style="
    background-color: black; height: 10px; 
    position: fixed; 
    /* top: 33%; */ left: 0px; right: 0px; 
    bottom: 33%; z-index: 9999;
       
"></div>
</div>