Seitengröße anpassen.
0 
Beat
0 
Gunnar Bittersmann
0
Seitengröße anpassen.
Hallo,
habe jetzt mehrere Stunden damit zugebracht irgendwie mein Design an verschiedene Auflösungen anzupassen. Damit mein ich natürlich das egal welche Auflösung der User hat, er nie einen Scrollbalken benutzen muss um die komplette Seite zu sehen.
Google und Co spucken immer die Sache mit dem <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
aus leider bringt das nicht den Gewünschten Erfolg.
Zum besseren verständniss nochmal den kompletten Quellcode.
<!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">
<head>
<title>internetseite</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
position: absolute;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: none;
}
a:active {
text-decoration: none;
}
-->
</style></head>
<body bgcolor="#FFFFFF">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="8" rowspan="2">
<img id="internetseite_01" src="images/internetseite_01.jpg" width="1049" height="357" alt="" /></td>
<td colspan="4">
<img id="internetseite_02" src="images/internetseite_02.gif" width="1511" height="161" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="1" height="161" alt="" /></td>
</tr>
<tr>
<td rowspan="9">
<img id="internetseite_03" src="images/internetseite_03.gif" width="57" height="1439" alt="" /></td>
<td rowspan="7">
<img id="internetseite_04" src="images/internetseite_04.jpg" width="1256" height="1259" alt="" /></td>
<td colspan="2" rowspan="8">
<img id="internetseite_05" src="images/internetseite_05.gif" width="198" height="1343" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="1" height="196" alt="" /></td>
</tr>
<tr>
<td colspan="8">
<img id="internetseite_06" src="images/internetseite_06.gif" width="1049" height="116" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="1" height="116" alt="" /></td>
</tr>
<tr>
<td colspan="2" rowspan="2">
<img id="internetseite_07" src="images/internetseite_07.gif" width="65" height="416" alt="" /></td>
<td colspan="3">
<img id="internetseite_08" src="images/internetseite_08.gif" width="395" height="228" alt="" /></td>
<td colspan="3">
<img id="internetseite_09" src="images/internetseite_09.gif" width="589" height="228" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="1" height="228" alt="" /></td>
</tr>
<tr>
<td>
<img id="internetseite_10" src="images/internetseite_10.gif" width="207" height="188" alt="" /></td>
<td colspan="3">
<img id="internetseite_11" src="images/internetseite_11.gif" width="344" height="188" alt="" /></td>
<td colspan="2" rowspan="2">
<img id="internetseite_12" src="images/internetseite_12.gif" width="433" height="381" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="1" height="188" alt="" /></td>
</tr>
<tr>
<td rowspan="5">
<img id="internetseite_13" src="images/internetseite_13.gif" width="50" height="711" alt="" /></td>
<td colspan="5">
<img id="internetseite_14" src="images/internetseite_14.gif" width="566" height="193" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="1" height="193" alt="" /></td>
</tr>
<tr>
<td colspan="3" rowspan="4">
<img id="internetseite_15" src="images/internetseite_15.gif" width="235" height="518" alt="" /></td>
<td colspan="3">
<img id="internetseite_16" src="images/internetseite_16.gif" width="396" height="178" alt="" /></td>
<td rowspan="4">
<img id="internetseite_17" src="images/internetseite_17.gif" width="368" height="518" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="1" height="178" alt="" /></td>
</tr>
<tr>
<td colspan="3" rowspan="3">
<img id="internetseite_18" src="images/internetseite_18.gif" width="396" height="340" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="1" height="160" alt="" /></td>
</tr>
<tr>
<td rowspan="2">
<img id="internetseite_19" src="images/internetseite_19.gif" width="1256" height="180" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="1" height="84" alt="" /></td>
</tr>
<tr>
<td>
<img id="internetseite_20" src="images/internetseite_20.gif" width="31" height="96" alt="" /></td>
<td>
<img id="internetseite_21" src="images/internetseite_21.gif" width="167" height="96" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="1" height="96" alt="" /></td>
</tr>
<tr>
<td>
<img src="images/Abstandhalter.gif" width="50" height="1" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="15" height="1" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="207" height="1" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="13" height="1" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="175" height="1" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="156" height="1" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="65" height="1" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="368" height="1" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="57" height="1" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="1256" height="1" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="31" height="1" alt="" /></td>
<td>
<img src="images/Abstandhalter.gif" width="167" height="1" alt="" /></td>
<td></td>
</tr>
</table>
</body>
</html>
-
habe jetzt mehrere Stunden damit zugebracht irgendwie mein Design an verschiedene Auflösungen anzupassen.
Dazu muss man in der Regel nichts tun. Es passt sich automatisch an, ausser man verhindert das mit Tabellendesign oder ähnlichem
Google und Co spucken immer die Sache mit dem [code lang=html]<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
Überlege mal haarscharf, worauf sich 100% beziehen könnte.
Falls dir das nicht klar ist, gib dem body mal:body{ border: 1px solid red }
Zum besseren Verständniss nochmal den kompletten Quellcode.
Es heisst Quälcode, und sowas übergebe ich dev/null.
mfg Beat
--
><o(((°> ><o(((°>
<°)))o>< ><o(((°>o
Der Valigator leibt diese Fische-
Danke für deine mühe -.-, ich denke ich weiss worauf du hinaus willst aber eine wirkliche Lösung haste nicht für mich parat ?
-
Danke für deine mühe -.-, ich denke ich weiss worauf du hinaus willst aber eine wirkliche Lösung haste nicht für mich parat ?
Ein Blick in deine Bildweiten, und das summiert sich schon mal zu über 2000px zusammen.
Beschreibe erst mal "unabhängig von der Bildschirmauflösung", und überlege, was Scrollbalken für einen Viewport von 300 x 300 px bedeuten.Nein eine Lösung habe ich nicht, weil dein Code nicht darstellt, was du eigentlich beabsichtigst.
mfg Beat
--
><o(((°> ><o(((°>
<°)))o>< ><o(((°>o
Der Valigator leibt diese Fische-
Ich möchte einfach nur das die Seite immer voll angezeigt wird.
Und man nicht nach rechts oder links scrollen muss.-
Ich möchte einfach nur das die Seite immer voll angezeigt wird.
Und man nicht nach rechts oder links scrollen muss.Ja und ich wünsche dir einen Wurm, den man dir aus der Nase ziehen könnte.
Erzähl mal, was und wie du diesen Code überhaupt produziert hast.mfg Beat
--
><o(((°> ><o(((°>
<°)))o>< ><o(((°>o
Der Valigator leibt diese Fische-
Ich möchte einfach nur das die Seite immer voll angezeigt wird.
Und man nicht nach rechts oder links scrollen muss.Ja und ich wünsche dir einen Wurm, den man dir aus der Nase ziehen könnte.
Erzähl mal, was und wie du diesen Code überhaupt produziert hast.mfg Beat
Design im Photoshop gemacht. Dann einfach als HTML Datei ausgeben lassen.
Leider Produziert Photoshop diese hässlichen Codes.Dann habe ich das ganze im Dreamweaver geöffnet und 2-3 Sachen verändert.
-
Design im Photoshop gemacht. Dann einfach als HTML Datei ausgeben lassen.
Leider Produziert Photoshop diese hässlichen Codes.Dann habe ich das ganze im Dreamweaver geöffnet und 2-3 Sachen verändert.
Aha, und was wissen die von deiner gewünschten Bildgrösse? Die haben einfach verwendet, was du ihnen vermittelt hast.
mfg Beat
--
><o(((°> ><o(((°>
<°)))o>< ><o(((°>o
Der Valigator leibt diese Fische-
Design im Photoshop gemacht. Dann einfach als HTML Datei ausgeben lassen.
Leider Produziert Photoshop diese hässlichen Codes.Dann habe ich das ganze im Dreamweaver geöffnet und 2-3 Sachen verändert.
Aha, und was wissen die von deiner gewünschten Bildgrösse? Die haben einfach verwendet, was du ihnen vermittelt hast.
mfg Beat
Richtig! Doch ich kenne z.B. die möglichkeit wenn man Flash als HTML Background einbindet die Scale so schreiben das das background immer auf die auflösung des users angepasst wird.
Das müsste doch im HTML auch realisirbar sein.
-
@@xam0r:
nuqneH
immer auf die auflösung des users angepasst wird.
Warum sollte man dir antworten, wenn du Antworten gar nicht liest?
Qapla'
--
Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
-
-
-
Hi,
Design im Photoshop gemacht. Dann einfach als HTML Datei ausgeben lassen.
Slave: "Pharaoh, I hurt's when I breathe!"
Pharaoh Bender: "Well, then - what d'you think you should stop doin' ...?"MfG ChrisB
--
Light travels faster than sound - that's why most people appear bright until you hear them speak.
-
-
-
-
-
-
-
@@xam0r:
nuqneH
Damit mein ich natürlich das egal welche Auflösung der User hat
Und du meinst auch nicht „egal, welche Auflösung der Bildschirm des Users hat“, denn diese ist völlig irrelevant.
Mit Photoshop wirst du deine Wünsche nicht erfüllen können. Nutze einen brauchbaren HTML-Editor oder schreibe den HTML-Quelltext selbst. http://de.selfhtml.org/html/text/index.htm@title=Semantisch.
Qapla'
--
Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck) -
Entferne die Tabelle.
Ja, das ist schon alles. Alle Bilder nacheinander aufreihen und den Rest macht der Browser selbst, wenn du verhindern möchtest, dass der Benutzer horizontal scrollen muss. (Ausnahme: Ein einzelnes Bild ist größer als sein Viewport, dann blenden die meisten Browser Scrollbalken ein)Wenn du verhindern möchtest, dass der Benutzer _überhaupt nicht scrollen_ muss, dann wird's kompliziert. Mein erster Ansatz wäre wohl die Breite einer "Zeile" mittels <br> zu begrenzen und den einzelnen Bildern dann eine width von 100/(Anzahl der Bilder pro Zeile) % zu geben. Aber dann kann es nach unten immernoch überlaufen.
Vielleicht wenn du dem body overflow:hidden; gibst (nicht ausprobiert) das sollte zuverlässig Scrollbalken unterbinden.
--
sh:( fo:| ch:? rl:( br:& n4:& ie:{ mo:} va:) de:µ_de:] zu:) fl:( ss:| ls:[ js:(