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>
Alles anzeigen
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