Avatar billede stig69 Nybegynder
11. april 2008 - 16:51 Der er 5 kommentarer

<hr> afstanden over under forskellig i IE & FF

ved brug af <hr> kommer der mere luft over og under stregen ved IE (7.0) i forhold til FF.

Problemet ligger sikkert i min css, men jeg har ikke kunne løse det.

Jeg har følgende html med css:


<!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>[hr]</title>
<style>
hr {
color:#dedede;
background-color:#dedede; 
width:100%;
height:1px;
line-height:1px;
border:0;
padding:0;
margin:0;
}
</style>
</head>

<body style="margin: 20px 0 0 20px">

<div>
  <p>over hr</p>
  <hr />
  <p>under hr</p>
</div>

</body>
</html>

Håber på lidt hjælp

Mvh

Stig
Avatar billede w13 Novice
11. april 2008 - 22:10 #1
Det tror jeg ikke. Browserne tolker det bare forskelligt. Sådan er det.
Avatar billede nyp Nybegynder
12. april 2008 - 14:49 #2
<style>
p{margin:0;padding:0;} /* Nulstiller p der briges af hr */
hr {
color:#dedede;
background-color:#dedede; 
width:100%;
height:1px;
line-height:1px;
border:0;
padding:0;
margin:15px;
*margin:10px; /* Hack til ie da den fortolker anderledes*/
}
</style>
Avatar billede w13 Novice
12. april 2008 - 15:47 #3
Husk i øvrigt, at <style> bør være <style type="text/css">.
Avatar billede nyp Nybegynder
12. april 2008 - 17:46 #4
p{ /* Nulstiller p der bruges i forbindelse med hr */
  margin:0px;
  *margin: 2px; /* Hack til ie da den fortolker anderledes*/
  padding:0;
}
hr {
color:#dedede;
background-color:#dedede; 
width:100%;
height:1px;
border:0;
padding:0;
margin:10px;
*margin:5px; /* Hack til ie da den fortolker anderledes*/

er vist mere korrekt
Avatar billede stig69 Nybegynder
21. april 2008 - 10:02 #5
@ nyp. Tak for din hjælp. Jeg benyttede noget af css og fik lavet noget der virkede. Mit problem var at p var sat til  p {0 0 20px 0 }
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester