Sehr geehrte html-seminar.de Forum-Teilnehmer,
meine Kenntnisse im Webdesign sind sehr rudimentär.
Ich habe eine neue Website mit dem SeaMonkey Composer erstellt.
Hier die html-Daten:
- <html lang="de">
- <head>
- <meta http-equiv="content-type" content="text/html; charset=UTF-8">
- <meta charset="UTF-8">
- <title>JUERGEN HEDWIG IMAGEFACTORY Fotografie Grafik- WebDesign</title>
- <link rel="stylesheet" type="text/css"
- href="./css/enlarge_website2.css">
- <link rel="stylesheet" type="text/css" href="./css/css.css">
- <!--[if IE]-->
- <link rel="stylesheet" href="./css/ie.css" type="text/css">
- <!--[endif]-->
- <link rel="stylesheet" href="css/lightbox.css" media="screen"
- type="text/css">
- <meta name="viewport" content="width=device-width, initial-scale=1,
- minimum-scale=1, maximum-scale=1">
- <meta name="content-language" content="de">
- <meta name="language" content="Deutsch">
- </head>
- <body>
- <span id="fc-18626"></span>
- <script>
- var fcr = Math.floor(Math.random()*99999999999);
- var _fcc = _fcc []; _fcc.push(["18626"]); _fcc.push(["trans"]);(function(){
- var fc = document.createElement("script");fc.async = true;
- fc.src = "https://www.fastcounter.de/fcount.php?rnd=" + fcr;
- var sc = document.getElementById("fc-18626");
- sc.appendChild(fc);
- })();</script><noscript style="color: rgb(255, 255, 255);">
- <a href="https://www.fastcounter.de/stats/18626/dashboard" rel="nofollow" style="display: none;" target="_blank" title="Free
- Counter"><img src="https://www.fastcounter.de/fcounter.php?id=18626;" alt="Free Counter" title="Free Counter"></a>
- </noscript>
- <div class="mittig">
- <div style="height: 75px; width: 378px; z-index: 1; left: 11px;
- top: -8px; position: absolute;">
- <table style="top: 2px; height: 677px; width: 942px; left: 0px;"
- cellspacing="2" cellpadding="2" border="0">
- <tbody>
- <tr>
- <td style="background-color: rgb(255, 255, 255);">
- <div id="logo">
- <table cellspacing="2" cellpadding="2" border="0">
- <tbody>
- <tr>
- <td style="background-color: rgb(255, 255,
- 255);">
- <div id="logo">
- <div style="height: 75px; width: 378px;
- left: 38px; top: 33px; position:
- absolute;"><a><img src="Bilder/logo.jpg"
- alt="" style="border: 0px solid ;
- width: 354px; height: 35px;"></a></div>
- </div>
- <div id="logo"><img style="width: 930px;
- height: 647px;"
- src="Bilder/hg_imagefactory.jpg" alt=""></div>
- <div style="position: absolute; left: 103px;
- top: 175px; width: 357px;"> <img
- style="top: 0px; left: 0px; width: 544px;
- height: 371px;" src="Bilder/Test.gif"
- alt=""></div>
- <br>
- </td>
- </tr>
- </tbody>
- </table>
- </div>
- <div style="position: absolute; left: 103px; top: 80px;
- width: 557px;"><b><a href="firmen-philosophie.html"><font
- style="font-family: Arial;" color="#333333"><small>IMAGEFACTORY</small></font></a></b><font
- style="font-family: Arial; color: rgb(64, 64, 64);">
- • </font><b><a href="references.html"><font
- style="font-family: Arial; color: rgb(64, 64,
- 64);"><small>REFERENCES</small></font></a></b><a><font
- style="font-family: Arial; color: rgb(64, 64,
- 64);"> </font></a><font style="font-family:
- Arial; color: rgb(64, 64, 64);"><a>•</a> <b><small><a
- href="contact.html"><span style="color:
- rgb(51, 51, 51);">CONTACT</span></a></small></b><a>
- •</a> <b><small><a href="network.html"><span
- style="color: rgb(51, 51, 51);">NETWORK</span></a></small></b></font><br
- style="font-family: Arial;">
- <small><b><small style="color: rgb(64, 64, 64);
- font-family: Arial;"><a href="imaginativ.html"><font
- size="-2"><font style="color: rgb(64, 64,
- 64);"><font><font>IMAGINATIV</font></font></font></font></a></small></b>
- <span style="font-family: Arial;"><span
- style="color: rgb(64, 64, 64);">•</span></span>
- <b> </b><b><a href="kreativ.html"><font
- style="font-family: Arial; color: rgb(64, 64,
- 64);" size="-2"><font><font><font>KREATIV</font></font></font></font></a></b>
- <span style="font-family: Arial;"><span
- style="color: rgb(64, 64, 64);">•</span></span>
- <b> </b><b><a href="kompetent.html" style="color:
- rgb(64, 64, 64); font-family: Arial;"><font
- size="-2"><span style="color: rgb(51, 51,
- 51);">KOMPETENT</span></font></a></b> <span
- style="font-family: Arial;"><span style="color:
- rgb(64, 64, 64);">•</span></span><small><small><small><small><font
- size="-2"><small><small><small><small><small><span
- style="font-family: Arial;"><span
- style="color: rgb(64, 64,
- 64);"></span></span> </small></small></small></small></small></font></small></small></small></small></small><small><small><small><small><small><small><font
- size="-2"><small><small><small><small><small><span
- style="font-family: Arial;"><span
- style="color: rgb(64, 64,
- 64);"></span></span>
- <b> </b></small></small></small></small></small></font></small></small></small></small></small><b>
- </b><b><a href="zielgerichtet.html"
- style="font-family: Arial;"><font style="color:
- rgb(64, 64, 64);" size="-2"><font><font><font>ZIELGERICHTET</font></font></font></font></a></b>
- <span style="font-family: Arial;"><span
- style="color: rgb(64, 64, 64);">•</span></span>
- <b><a href="termingenau.html"><font style="color:
- rgb(64, 64, 64); font-family: Arial;"
- size="-2"><font><font><font>TERMINGENAU</font></font></font></font></a></b></small><span
- style="color: rgb(64, 64, 64);"></span><small><small><a
- style="color: rgb(64, 64, 64); font-family:
- Arial;" size="-2"><font><font><font><span
- style="color: rgb(51, 51, 51);"></span></font></font></font></a></small></small><span
- style="color: rgb(64, 64, 64);"><br>
- <span style="font-family: Arial; color: rgb(255, 0,
- 0);"></span><br>
- </span></div>
- <div style="position: absolute; left: 545px; top: 606px;
- width: 757px;"> <small><a
- href="firmen-philosophie.html" style="font-family:
- Arial; color: rgb(64, 64, 64);"><font size="-2"><span
- style="color: rgb(51, 51, 51);">Imagefactory</span></font></a></small>
- <font size="-2"><a style="font-family: Arial;"><span
- style="color: rgb(51, 51, 51);"></span></a><span
- style="font-family: Arial;">•</span></font><span
- style="font-family: Arial; color: rgb(64, 64, 64);"></span>
- <font size="-2"><span style="font-family: Arial;"></span><a
- href="impressum.html" style="font-family: Arial;"><span
- style="color: rgb(51, 51, 51);">Impressum</span></a></font><a
- style="font-family: Arial;"> </a><font size="-2"><a
- style="font-family: Arial;">• </a><span
- style="font-family: Arial;">© 2015 JÜRGEN HEDWIG
- IMAGEFACTORY</span></font></div>
- <script src="js/Redirect_Mobile_Devices.js">
- </script> </td>
- </tr>
- </tbody>
- </table>
- </div>
- </div>
- </body>
- </html>
Nun versuche ich den html-Text so zu verändern, daß sich die Website automatisch an die Browserfenster-Größe anpaßt.
So daß die Website immer formatfüllend im Browser-Fenster angezeigt wird, unabhängig von der Größe des Browser-Fensters.
Das sollte mit allen gängigen Browsern funktionieren - Firefox, IE, Chrome, SeaMonkey, etc..
Nun habe ich schon lange Zeit gegougled - habe aber leider für dieses Problem keine Lösung gefunden.
Mit folgendem css konnte ich die Website schon vergrößern:
body {
transform: scale(2.0);
transform-origin: 1 1;
// add prefixed versions too.
}
Damit wird jedoch nur eine fixe Größe erreicht, die sich nicht der Browser-Fenstergröße anpaßt.
Nun meine Frage:
Gib es vielleicht eine css transform Variante mit der sich die Website wie oben beschrieben der Browser-Fenstergröße anpaßt?
Bzw. gibt es eine andere Möglichkeit, so daß sich die Website wie oben beschrieben der Browser-Fenstergröße anpaßt?
Über hilfreiche Tipps von Euch würde ich mich sehr freuen!
Dafür schon jetzt meinen herzlichsten Dank!
Freundliche Grüße
Jürgen Hedwig / YunPo