<html>
<head>
<style>
p::before {
  content: "Some text" " that should be at an (x,y) of (300,300)";
  position: absolute;
  left: 300px;
  top: 300px;
}

div::after {
  float: right;
  width:100px;
  height:100px;
  background-color:green;
  color: green;
  content: "Invisible";
}
</style>
</head>
<body>
<p></p>
<div>In this paragraph, there should be a right floating green ::after block.  It should be ok to do this.
</div>