CSS to create full-width border?

❓Help
#1

I am trying to create a background that looks like a good old-fashioned yellow legal pad. Here is what I have:

image
image1285×173 14.5 KB

Here is the relevant CSS:

/*set yellow background*/
div.Document > div.Document-rootNode {
background-color: #F2F5A9;
}

/*tighten up line spacing and add blue line*/
div.Node-renderedContent.node-line {
   line-height: 16px;
   border-bottom-style: solid;
   border-width: 2px;
   border-color:#CEE3F6;
}

I’d like to have the blue lines extend to the full width of the page. Is that possible?

#2

Hopefully this does it or gets you closer

/*set yellow background*/
div.Document > div.Document-rootNode {
background-color: #F2F5A9;
}

/*tighten up line spacing and add blue line*/
.Node-self {
  width: calc(100% + 900px);
  padding-left: 900px;
  margin-left: -900px;
  line-height: 16px;
  border-bottom-style: solid;
  border-width: 2px;
  border-color:#CEE3F6;
}
#3

Thanks, that does move me closer but unfortunately somehow messes up the ability to click on the bullet accurately. Seems the mouse finds the bullet somewhere northeast of where it is displayed, if that makes sense.