Basti15517
Neues Mitglied
Hallo eine Kurze frage, ich habe eine Seite geschrieben wie auch richtig auf dem Laptop unter, Internet Explorer, Opera und Firefox angezeigt wird.
wenn ich jetzt mit dem Smartphone z.B. iPhone auf die Seite gehe verschieben sich immer die Texte aber auch nur einige.
Kann mir jemand sagen warum und wie es besser geht.
Für weitere Tipps wer ich natürlich auch Dankbar falls jemanden noch etwas auffällt.
es geht Spezial um diesen Code:
wenn ich jetzt mit dem Smartphone z.B. iPhone auf die Seite gehe verschieben sich immer die Texte aber auch nur einige.
Kann mir jemand sagen warum und wie es besser geht.
Für weitere Tipps wer ich natürlich auch Dankbar falls jemanden noch etwas auffällt.
es geht Spezial um diesen Code:
Code:
<div id="header_inhalt">
<p align="left">
<b>
Sie suchen einen vertrauensvollen und zuverlässigen Ansprechpartner,</br>
wenn es um die Wartung oder die Reparatur Ihres Autos geht?</br>
Dann sind Sie bei uns genau richtig!</br>
</b>
</p>
</div>
#header_inhalt
{
position:absolute;
font-size: 18px;
color:#585858;
top:0px;
margin-top:485px;
margin-left:200px;
text-align: center;
}
Code:
<body>
<div id="wrapper">
<div id="background_pic">
<img src="bilder/background.jpg" width="961" height="1339" alt="Bildtext"/>
</div>
<!-- Header -->
<div id="telefon">
<b>033666 - 33500</b>
</div>
<div id="email_kontakt">
<p align="left">
<b>
<font color="#000000"><font size="5"><b>Kontakt</b></font><br></font>
Haben Sie fragen</br>
</b>
</p>
</div>
<a id="email_kontakt_button" href="kontakt.html"></a>
<div id="header_inhalt">
<p align="left">
<b>
Sie suchen einen vertrauensvollen und zuverlässigen Ansprechpartner,</br>
</b>
</p>
</div>
<div id="Udo_text">
<p align="left">
<b>
<u>Udo</u>
</b>
</p>
</div>
<!-- content -->
<a id="reperatur_service" href="leistung"></a>
<div id="reparatur_service_1">
<p align="left">
In unserer KFZ-Werkstatt</br>
</p>
</div>
<a id="tuev_service" href="tuev_service"></a>
<div id="tuev_service_1">
<p align="left">
Sie Brauchen TÜV und wollen</br>
</p>
</div>
<a id="auto_an_und_verkauf" href="http://mobile.de/" target="_blank"></a>
<div id="auto_an_und_verkauf_1">
<p align="left">
bei ihnen melden.</br>
</p>
</div>
<!-- navigation -->
<a id="home" href="index.html"></a>
<a id="leistung" href="leistung.html"></a>
<a id="tuev_service_menue" href="tuev_service.html"></a>
<a id="gebrauchtwagen" href="http://mobile.de/" target="_blank"></a>
<a id="kontakt_menue" href="kontakt.html"></a>
<!-- footer -->
<a id="aktuelle_gebrauchtwagen" href="http://mobile.de/" target="_blank" style="text-decoration:none">
<p align="left">
<b>Aktuelle Gebrauchtwagen</b>
</a>
</p>
</div>
<a id="impressum" href="Impressum.html" style="text-decoration:none">
<p align="left">
<b>Impressum</b>
</a>
</div>
</body>
</html>
Code:
@charset "utf-8";
body
{
margin:0px auto;
text-align: left;
min-width:1339px;
background-color:#0e0e0e
}
#wrapper
{
position:absolute
float:left;
display: block;
width:1339px;
margin:0 auto;
}
/* Header */ /* Header */
#telefon
{
position:absolute;
float:left;
font-size: 18px;
color:#000;
top:0px;
margin-top:25px;
margin-left:1010px;
text-align:center;
}
a#home
{
position:absolute;
float:left;
background:url(bilder/hover/home.jpg);
top:0px;
width:61px;
height:31px;
margin-top:66px;
margin-left:580px;
text-align: center;
}
#home:hover
{
background-position: 0px 31px;
}
a#leistung
{
position:absolute;
float:left;
background:url(bilder/hover/leistung.jpg);
top:0px;
width:89px;
height:31px;
margin-top:65px;
margin-left:650px;
text-align: center;
}
#leistung:hover
{
background-position: 0px 29px;
}
a#tuev_service_menue
{
position:absolute;
float:left;
background:url(bilder/hover/tuev.jpg);
top:0px;
width:115px;
height:31px;
margin-top:65px;
margin-left:750px;
text-align: center;
}
#tuev_service_menue:hover
{
background-position: 0px 29px;
}
a#gebrauchtwagen
{
position:absolute;
float:left;
background:url(bilder/hover/gebrauchtwagen.jpg);
top:0px;
width:161px;
height:31px;
margin-top:65px;
margin-left:875px;
text-align: center;
}
#gebrauchtwagen:hover
{
background-position: 0px 29px;
}
a#kontakt_menue
{
position:absolute;
float:left;
background:url(bilder/hover/kontakt.jpg);
top:0px;
width:89px;
height:31px;
margin-top:65px;
margin-left:1040px;
text-align: center;
}
#kontakt_menue:hover
{
background-position: 0px 29px;
}
#background_pic
{
text-align: center;
margin-top:20px;
margin-bottom:20px;
}
#email_kontakt
{
position:absolute;
float:left;
font-size: 16px;
color:#585858;
top:0px;
margin-top:400px;
margin-left:920px;
text-align: center;
}
a#email_kontakt_button
{
position:absolute;
float:left;
background:url(bilder/hover/email_kontakt_hover.jpg);
top:0px;
width:224px;
height:48.5px;
margin-top:525px;
margin-left:835px;
text-align: center;
}
#email_kontakt_button:hover
{
background-position: 0px 48.5px;
}
#header_inhalt
{
position:absolute;
font-size: 18px;
color:#585858;
top:0px;
margin-top:485px;
margin-left:200px;
text-align: center;
}
#Mertens_Eckard_KFZ_SERVIE
{
position:absolute;
float:left;
font-size: 18px;
color:#585858;
top:0px;
margin-top:550px;
margin-left:200px;
text-align: center;
}
/* Web Inhalt */ /* Web Inhalt */
a#reperatur_service
{
position:absolute;
float:left;
background:url(bilder/hover/reperatur_service_hover.jpg);
top:0px;
width:300px;
height:45px;
margin-top:640px;
margin-left:190px;
text-align: center;
}
#reperatur_service:hover
{
background-position: 0px 45px;
}
#reparatur_service_1
{
position:absolute;
float:left;
font-size: 18px;
line-height:22px;
color:#585858;
top:0px;
margin-top:848px;
margin-left:225px;
text-align: center;
}
a#tuev_service
{
position:absolute;
float:left;
background:url(bilder/hover/tuev_service_hover.jpg);
top:0px;
width:300px;
height:45px;
margin-top:635px;
margin-left:455px;
text-align: center;
}
#tuev_service:hover
{
background-position: 0px 45px;
}
#tuev_service_1
{
position:absolute;
float:left;
font-size: 18px;
line-height:22px;
color:#585858;
top:0px;
margin-top:848px;
margin-left:530px;
text-align: center;
}
a#auto_an_und_verkauf
{
position:absolute;
float:left;
background:url(bilder/hover/auto_an_und_verkauf_hover.jpg);
top:0px;
width:300px;
height:45px;
margin-top:635px;
margin-left:820px;
text-align: center;
}
#auto_an_und_verkauf:hover
{
background-position: 0px 45px;
}
#auto_an_und_verkauf_1
{
position:absolute;
font-size: 18px;
line-height:22px;
color:#585858;
top:0px;
margin-top:848px;
margin-left:845px;
text-align: center;
}
/* Web footer */ /* Web footer */
a#aktuelle_gebrauchtwagen
{
position:absolute;
float:left;
font-size: 30px;
line-height:22px;
color:#585858;
top:0px;
margin-top:1116px;
margin-left:230px;
text-align: center;
}
#aktuelle_gebrauchtwagen:hover
{
position:absolute;
float:left;
font-size: 24px;
line-height:22px;
color:#000;
top:0px;
margin-top:1116px;
margin-left:230px;
text-align: center;
}
#dandb
{
position: absolute;
float: left;
font-size: 14px;
line-height: 22px;
color: #666;
top: 0px;
margin-top: 1300px;
margin-left: 820px;
text-align: center;
}
#impressum
{
position: absolute;
float: left;
font-size: 16px;
color: #666;
top: 0px;
margin-top: 1315px;
margin-left: 600px;
text-align: center;
}
#impressum:hover
{
position:absolute;
float:left;
font-size: 16px;
color:#000;
top:0px;
margin-top: 1315px;
margin-left: 600px;
text-align: center;
}