JavaScript: set caret position to begining of first paragraph (Opera bug)

In a contenteditable element when the user presses CTRL+Home I'm trying to have every browser move the caret position to the beginning of the first paragraph.

Let's presume that the entire page is editable and we're not considering anything other than just the direct goal at hand.

This is working fine in Firefox, Safari and IE 10 however Opera 12 refuses to obey. Here is the code...

var s = window.getSelection();

if (e.ctrlKey && e.keyCode==36)
{
 var p0 = document.getElementsByTagName('p')[0];

 if (p0.firstChild.nodeName.toLowerCase()=='#text')
 {//<p>text
  var p = p0.firstChild;
 }
 else if (p0.firstChild.firstChild.nodeName.toLowerCase()=='#text')
 {//<p><em>text
  var p = p0.firstChild.firstChild;
 }

 if (typeof p=='object')
 {
  s.getRangeAt(0).setStart(p,0);
  s.getRangeAt(0).setEnd(p,0);
  s.collapseToStart();
 }
}

Solution

This issue is caused by CSS margin on the paragraphs in Opera. Why? I have absolutely no idea, just that this minimal test case reproduces it.

A work-around is subjective, margin and padding have different uses and in my circumstances I am unable to utilize padding in place of margins thus making me rely on Opera fixing this bug.

example.xhtml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Opera Contenteditable margin CTRL+Home/End Bug</title>
<style type="text/css">
p
{
 /*margin: 0px 20px 14px 24px;*/
 margin-top: 0px;
 margin-right: 20px;
 margin-bottom: 14px;
 margin-left: 24px;
}
</style>
</head>

<body>

<div contenteditable="true">
<p>Paragraph one.</p>
<p>Paragraph two.</p>
</div>

</body>
</html>