witam

mam problem gdy chce zrobić opis produktu w htmlu i wstawić tam kod to zmienia mi go .
wstawiam np taki:

<style type="text/css">
<!--

a:link {color: #0000ff;}
a:visited {color: #800080;}
a:active {color: #ff0000;}

body {
margin: 0;
height: 100%;
width: 100%;
background-color: #ffffff;
background-image: url(./image/szablon.jpg);
background-repeat: no-repeat;
}
img {
border-width: 0;
vertical-align: top;
}
.dfltt {
font-family: 'Times New Roman';
font-size: 12px;
font-weight: normal;
font-style: normal;
text-decoration: none;
text-align: left;
color: #000000;
}
.lalign {
position: relative;
text-align: left;
}
.ralign {
position: relative;
text-align: right;
}
.calign {
position: relative;
text-align: center;
}
.jalign {
position: relative;
text-align: justify;
}
#Oobj1 {
position: absolute;
font-size: 10px;
z-index: 1;
text-align: left;
left: 4.80em;
top: 1.80em;
width: 43.10em;
height: 3.40em;
}
.txt0 {
font-family: Verdana, sans-serif;
font-size: 24px;
color: #ff0000;
}
.bold {font-weight: bold;}
.ital {font-style: italic;}
.txt1 {
font-family: Verdana, sans-serif;
font-size: 24px;
}
#Oobj2 {
position: absolute;
font-size: 10px;
z-index: 2;
text-align: left;
left: 50.10em;
top: 2.30em;
width: 16.50em;
height: 2.60em;
}
.txt2 {
font-family: Tahoma, sans-serif;
font-size: 16px;
color: #ffffff;
}
#Oobj3 {
position: absolute;
font-size: 10px;
z-index: 3;
text-align: left;
left: 47.10em;
top: 24.20em;
width: 21.40em;
height: 4.30em;
}
#Oobj4 {
position: absolute;
font-size: 10px;
z-index: 4;
text-align: left;
left: 29.50em;
top: 25.20em;
width: 17.20em;
height: 2.90em;
}
.txt3 {
font-family: 'Arial CE', sans-serif;
font-size: 15px;
color: #ffffff;
}
.txt4 {
font-size: 19px;
color: #ff0000;
}
#Oobj5 {
position: absolute;
font-size: 10px;
z-index: 5;
text-align: left;
left: 4.50em;
top: 25.60em;
width: 35.80em;
height: 2.20em;
}
.txt5 {
font-family: 'Arial CE', sans-serif;
font-size: 15px;
color: #ff0000;
}
#Oobj6 {
position: absolute;
font-size: 10px;
z-index: 6;
text-align: left;
left: 5.50em;
top: 7.80em;
width: 40.00em;
height: 13.70em;
}
.txt6 {
font-family: 'Times New Roman CE', serif;
font-size: 19px;
color: #ffffff;
}
#Oobj7 {
position: absolute;
font-size: 10px;
z-index: 7;
text-align: left;
left: 5.50em;
top: 29.70em;
width: 40.00em;
height: 2.50em;
}
.txt7 {
font-family: 'Times New Roman CE', serif;
font-size: 16px;
}

-->
</style>
</head>

<body>

<div id="Oobj1">
<div id="Grtf14" class="dfltt">
<span class ="txt0"><span class ="bold ital"> auto fiat </span></span><span class ="txt1"><span class ="bold ital">2011</span><br>
</span></div>
</div>


przerabia mi na taki [ nie działa ] :

<!-- a:link {color: #0000ff;} a:visited {color: #800080;} a:active {color: #ff0000;} body { margin: 0; height: 100%; width: 100%; background-color: #ffffff; background-image: url(./image/szablon.jpg); background-repeat: no-repeat; } img { border-width: 0; vertical-align: top; } .dfltt { font-family: 'Times New Roman'; font-size: 12px; font-weight: normal; font-style: normal; text-decoration: none; text-align: left; color: #000000; } .lalign { position: .............................

dlaczego się tak dzieje ???