[CSS] hr h2, błąd opera marginesy Opcje

[Damonsson]

[HTML] pobierz, plaintext 
<div id="kontener">
  <div id="srodek">
    <hr id="hrlewa"/>
    <h2>Lorem ipsum</h2>
    <hr id="hrprawa"/>
[HTML] pobierz, plaintext 

[CSS] pobierz, plaintext 
* {        
  margin: 0;
  padding: 0;
  border: 0 none;
  outline: 0 none;
  list-style-type: none;
  text-decoration: none;
}
html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  background: #878787;
      }
#kontener {
  width: 980px;
  margin: 0 auto;
  overflow: hidden;
}
 
#srodek {
  width: 100%;
}
 
h2 {
  float:left;
  font-weight: normal;
  color: #ddd;
  font-size: 24px;
  font-family: verdana;
  text-shadow:0px -1px 4px #000;
  letter-spacing: 1px;
  margin: -15px 0px 0px 0px;
}
 
hr {
  height: 1px;
  color: #912c2c;
  background-color: #912c2c;
  border-width: 1px;
  border-color: #8a6262;
  border-style: solid none solid none;
  box-shadow: 0px 1px 0px #909090;
  -moz-box-shadow: 0px 1px 0px #909090;
  -webkit-box-shadow: 0px 1px 0px #909090;
}
hr, x:-moz-any-link, x:default {height: 3px;}
 
#hrlewa {
  float:left;
  width: 180px;
  margin: 0px 5px 0px 35px;
}
 
#hrprawa {
  width: 700px;
  margin: 15px 32px 0px 5px;
}
[CSS] pobierz, plaintext 

W ff i ie wszystko jest ok, po dopisaniu, bądź skróceniu napisu Lorem ipsum, linia prawa się przesuwa ładnie. Ale na operze kompletnie się coś psuję. Ma ktoś jakieś pomysły?

(IMG:http://i52.tinypic.com/15ycayu.jpg)
Tak to wygląda.

[tehaha]

jak dla mnie to błędem jest ujemny margines i nic dziwnego, że na różnych przeglądarkach, różnie będzie się to zachowywało, takie coś to prędzej zrób umieszczając h2 w div, dla diva dajesz tło z taką kreską, dla h2 dajesz jednolite tło i display:inline;