Halli Hallo
Allso ich bin neu und stelle mich erstma vor.
Bin der pegger, 18 Jahre alt, mache Hp´s meines wissenstandes nach aus hobby genauso wie grafik designen und hätte direkt ma ne frage.
Ich habe meiner Mutter für ihre Hundeartikel die sie im Netz verkaufen will eine Homepage (mit Photoshop & Slice) erstellt und diese Html Datei dann im dreamweaver geöffnet. Das einzige was ich machen wollte war ein Text auf die weissen freiflächen (die Freiflächen sind bei mir Hintergrund "bilder" in weiss) bringen, per sogenannten Layout (die Box zum groß ziehen und rein schreiben). Wenn ich nun das ganze Hochlade und meine Mutter geht auf die Seite, verschieben sich diese Boxen (ich meine die werden div Boxen gennant) und stehen völlig wo anders. Was hilft mir da?
Mein Punktekonto 0 Punkte
Problem bei layout in dreamweaver
Moderatoren: Basti, Ingo
18 Beiträge • Seite 1 von 2 • 1, 2
Problem bei layout in dreamweaver
von pegger am 09.10.2008, 19:47
- pegger
- Mitglied
- Beiträge: 8
- Registriert: 09.10.2008, 19:40
Re: Problem bei layout in dreamweaver
von Jupla am 09.10.2008, 19:52
Wenn du das ganze in Dreamweaver machst, und geslict hast, sinds sicherlich keine Divboxen, sondern Tabellen.
Es wird daran liegen, das du deinen imaginären "Div"- Boxen eine feste größe gegeben hast, und der Inhalt, nach Überschreitung der Angabe einen Umbruch macht.
Aber genauere Angaben kan man erst machen, wen man mal den Quelltext sieht, deine Aussage ist sehr wage
mfg
Jupla
Es wird daran liegen, das du deinen imaginären "Div"- Boxen eine feste größe gegeben hast, und der Inhalt, nach Überschreitung der Angabe einen Umbruch macht.
Aber genauere Angaben kan man erst machen, wen man mal den Quelltext sieht, deine Aussage ist sehr wage
mfg
Jupla
Meine Domains / Projeckte:
http://www.jupla.de
Windows ist geil , ich hab damit Linux runtergeladen...
http://www.jupla.de
Windows ist geil , ich hab damit Linux runtergeladen...
-
Jupla - Mitglied
- Beiträge: 248
- Registriert: 13.06.2008, 18:52
- Wohnort: Bernburg
Re: Problem bei layout in dreamweaver
von Ingo am 09.10.2008, 20:01
Hi + willkommen!
... Und wenn das Projekt eh schon online ist, wäre auch ein Link hilfreich.
Gruß, Ingo
... Und wenn das Projekt eh schon online ist, wäre auch ein Link hilfreich.
Gruß, Ingo
Die beste Browserweiche ... sitzt zwischen den Ohren ;o]
-
Ingo - Moderator
- Beiträge: 696
- Registriert: 01.04.2007, 23:21
- Wohnort: Neuss/NRW
Re: Problem bei layout in dreamweaver
von pegger am 09.10.2008, 20:07
so hier der code
der Link (der code ist von der Seite wir ueber uns ! http://s260480997.online.de/
- Code: Alles auswählen
</style></head>
<body leftmargin="0%" topmargin="0%" marginwidth="0%" marginheight="0%">
<div id="Layer3">
<p align="left">Liebe Hundefreunde,</p>
<p align="left">willkommen bei „Gabis Hundelädchen“ .<br>
Hier findet Ihr ausgesuchte sowie teils persönlich getestete Artikel rund um den Hund.</p>
<p align="left">Jeder Hundebesitzer sowie auch ich in der Vergangenheit, benötigt im Laufe eines Hundelebens die verschiedensten Dinge. Einiges davon öfters, anderes in größeren Zeitabständen und manches möchte man vielleicht auch einfach nur „haben“... weil es so gut gefällt.</p>
<p align="left">Nicht immer ist man bei der Suche mit der Qualität, der Passform und dem Design zufrieden, findet nur die normale Supermarktware oder die Artikel einschlägiger „Ketten“. <br>
Nicht immer findet man den gesuchten Artikel überhaupt.<br>
Nicht immer können die Produkt- und Preisunterschiede plausibel erläutert werden.</p>
<p align="left">Aus diesem Grund ist die Idee der Eröffnung eines eigenen „Lädchens“ entstanden, mit ausgesuchten, qualitativ hochwertigen Artikeln im guten Preis-Leistungs-Verhältnis.</p>
<p align="left">Ich hoffe, ich habe in der ersten Produktauswahl Euren Geschmack getroffen.<br>
Das Sortiment wird natürlich weiterhin mit interessanten Artikeln ständig weiter ausgebaut. Ein regelrechter Online-Shop ist jedoch nicht vorgesehen, da ich die Beratung, das Anprobieren und Besichtigen in den Vordergrund stelle.<br>
Natürlich kann in besonderen Fällen auch mal ein Päckchen „geschnürt“ werden.</p>
<p align="left">Viel Spaß nun beim Stöbern in meinem Hundelädchen</p>
<p align="left"> <strong>Gabi mit Lena und Chessy <img src="pfote.gif" width="20" height="21"></strong><br>
</p>
</div>
der Link (der code ist von der Seite wir ueber uns ! http://s260480997.online.de/
- pegger
- Mitglied
- Beiträge: 8
- Registriert: 09.10.2008, 19:40
Re: Problem bei layout in dreamweaver
von Ingo am 09.10.2008, 20:25
Hi.
Was mir bisher nur auffällt, ist, dass #Layer3 gut 100px zu breit ist oder aber zu weit rechts sitzt.
Also könnte man entweder width:605px oder left:284px testen. Ansonsten verschiebt sich bei mir
(IE, FF, Op) eigentlich nichts. Man muss nur darauf achten, dass left + width des Layer3 nicht größer
sind als die Gesamtbreite der Seite.
Gruß, Ingo
Was mir bisher nur auffällt, ist, dass #Layer3 gut 100px zu breit ist oder aber zu weit rechts sitzt.
Also könnte man entweder width:605px oder left:284px testen. Ansonsten verschiebt sich bei mir
(IE, FF, Op) eigentlich nichts. Man muss nur darauf achten, dass left + width des Layer3 nicht größer
sind als die Gesamtbreite der Seite.
Gruß, Ingo
Die beste Browserweiche ... sitzt zwischen den Ohren ;o]
-
Ingo - Moderator
- Beiträge: 696
- Registriert: 01.04.2007, 23:21
- Wohnort: Neuss/NRW
Re: Problem bei layout in dreamweaver
von pegger am 09.10.2008, 20:28
Das Problem ist eigentlich das es bei meiner Mutter aufm Laptop ca 4cm über den Rand rausragt!
- pegger
- Mitglied
- Beiträge: 8
- Registriert: 09.10.2008, 19:40
Re: Problem bei layout in dreamweaver
von Eyecatcher am 09.10.2008, 20:31
Ohje,
du solltest auf die absolute Positionierung (position:absolute) verzichten, und deinen Content in die Tabellenstruktur integrieren. Wie genau das in deinem Fall aussehen muss, ist schwer zu sagen, durch die vielen TDs steigt man als Aussenstehender (was man bei von Dreamweaver erstelltem Code ja eigentlich immer ist) kaum durch.
Meine Empfehlung:
Den Code per Div und CSS noch einmal neu schreiben und auf Tabellen verzichten. Bei einer so leichten Seitenkonstruktion brauchst du (wenn ich mich auf die schnelle nicht irre) nur fünf Div Boxen. Nachfolgend der Code, der für deine Seite ausreichen sollte:
HTML:
CSS:
du solltest auf die absolute Positionierung (position:absolute) verzichten, und deinen Content in die Tabellenstruktur integrieren. Wie genau das in deinem Fall aussehen muss, ist schwer zu sagen, durch die vielen TDs steigt man als Aussenstehender (was man bei von Dreamweaver erstelltem Code ja eigentlich immer ist) kaum durch.
Meine Empfehlung:
Den Code per Div und CSS noch einmal neu schreiben und auf Tabellen verzichten. Bei einer so leichten Seitenkonstruktion brauchst du (wenn ich mich auf die schnelle nicht irre) nur fünf Div Boxen. Nachfolgend der Code, der für deine Seite ausreichen sollte:
HTML:
- Code: Alles auswählen
<div id="gesamt">
<div id="kopf"></div>
<div id="mitte">
<div id="navi">
<!-- Navigation -->
<a href="#"><img src="startseite.jpg" alt="Startseite" /></a>
</div>
<div id="content">
<!-- Inhalt -->
</div>
<div style="float:none;"></div>
</div>
<div id="fuss"></div>
</div>
CSS:
- Code: Alles auswählen
#gesamt {
padding:0px;
margin:0 auto;
width:1025px;
}
#kopf {
width:1025px;
height:__px;
background:url("kopf.jpg");
}
#mitte {
width:1025px;
overflow:auto;
background:url("mitte.jpg");
}
#navi {
float:left;
width:400px;
}
#content {
float:left;
width:625px;
}
#fuss {
width:1025px;
height:__px;
background:url("fuss.jpg");
}
-
Eyecatcher - Mitglied
- Beiträge: 395
- Registriert: 01.03.2008, 21:56
- Wohnort: NRW
Re: Problem bei layout in dreamweaver
von pegger am 09.10.2008, 20:34
Hehe danke für die Antwort nur was genau soll ich damit jetzt machen 
- pegger
- Mitglied
- Beiträge: 8
- Registriert: 09.10.2008, 19:40
Re: Problem bei layout in dreamweaver
von Jupla am 09.10.2008, 20:39
Ja das ist ein wenig schwer für ihn, er ist der WYSIWYG - Mensch
beschäftige dich mit html und css (DIV) das ist ganz Simple, zumindest in deinem fall, der Code vom Vorpsoter, sagt eigentlich namentlich schon alles :
gesamt
kopf
fuß
etc...
mfg
beschäftige dich mit html und css (DIV) das ist ganz Simple, zumindest in deinem fall, der Code vom Vorpsoter, sagt eigentlich namentlich schon alles :
gesamt
kopf
fuß
etc...
mfg
Meine Domains / Projeckte:
http://www.jupla.de
Windows ist geil , ich hab damit Linux runtergeladen...
http://www.jupla.de
Windows ist geil , ich hab damit Linux runtergeladen...
-
Jupla - Mitglied
- Beiträge: 248
- Registriert: 13.06.2008, 18:52
- Wohnort: Bernburg
Re: Problem bei layout in dreamweaver
von Ingo am 09.10.2008, 20:48
Es gibt 2 Wege:
Der kurze, aber nicht so elegante: Ändere die CSS-Angaben im Kopf der HTML-Datei, genaue Werte
sind auch (nicht nur) Geschmacksfrage - ausprobieren:
Das sollte eigentlich den "Überlauf" verhindern. Bitte mal ausprobieren, falls noch keine andere Lösung
geholfen hat.
Der lange, aber mittelfristig ganz sicher bequemere Weg ist der, den Eyecatcher ansprach: Umstellen
des Quelltextes auf Div-Layouts statt Tabellen. Tabellengestützte Quelltexte sind auf Dauer unübersichtlich
und im Detail oft nur mit viel Fingerspitzengefühl veränderbar - kurz: wenig wartungsfreundlich.
Die Einarbeitung/Umgewöhnung an Divs ist zwar lästig, rentiert sich aber mit Sicherheit.
Gruß, Ingo
Der kurze, aber nicht so elegante: Ändere die CSS-Angaben im Kopf der HTML-Datei, genaue Werte
sind auch (nicht nur) Geschmacksfrage - ausprobieren:
- Code: Alles auswählen
#Layer3 {
position:absolute;
left:384px; /* alternativ auch hier, ca. 100px weniger */
top:194px;
width:605px; /* HIER, war 705px */
height:452px;
z-index:1;
}
Das sollte eigentlich den "Überlauf" verhindern. Bitte mal ausprobieren, falls noch keine andere Lösung
geholfen hat.
Der lange, aber mittelfristig ganz sicher bequemere Weg ist der, den Eyecatcher ansprach: Umstellen
des Quelltextes auf Div-Layouts statt Tabellen. Tabellengestützte Quelltexte sind auf Dauer unübersichtlich
und im Detail oft nur mit viel Fingerspitzengefühl veränderbar - kurz: wenig wartungsfreundlich.
Die Einarbeitung/Umgewöhnung an Divs ist zwar lästig, rentiert sich aber mit Sicherheit.
Gruß, Ingo
Die beste Browserweiche ... sitzt zwischen den Ohren ;o]
-
Ingo - Moderator
- Beiträge: 696
- Registriert: 01.04.2007, 23:21
- Wohnort: Neuss/NRW
Re: Problem bei layout in dreamweaver
von Jupla am 09.10.2008, 20:59
Wenn ich dir dazu noch nen Tipp geben darf:
Überlege immer was für Divs ( boxen) du brauchst, und reihe diese der Reihe nach auf,
dabei achte darauf, ob diese mehrmals vorkommen, oder in ihrer Form einmalig sind
im Einzelfall heißt es "id=" bei Widerholung "class=" z.B:
Das sollte für den Anfang reichen danach gibst du den einzelnen Containern Eigenschaften in einer seperaten css Datei
so ist es sogar wesentlich einfacher als ein tabellenlayout wie ich finde.
mfg
Jupla
Überlege immer was für Divs ( boxen) du brauchst, und reihe diese der Reihe nach auf,
dabei achte darauf, ob diese mehrmals vorkommen, oder in ihrer Form einmalig sind
im Einzelfall heißt es "id=" bei Widerholung "class=" z.B:
- Code: Alles auswählen
<div id="ringsherum">
<div id="header"></div>
<div id="navi"></div>
<div id="content"></div>
<div id="footer"></div>
</div>
Das sollte für den Anfang reichen danach gibst du den einzelnen Containern Eigenschaften in einer seperaten css Datei
so ist es sogar wesentlich einfacher als ein tabellenlayout wie ich finde.
mfg
Jupla
Meine Domains / Projeckte:
http://www.jupla.de
Windows ist geil , ich hab damit Linux runtergeladen...
http://www.jupla.de
Windows ist geil , ich hab damit Linux runtergeladen...
-
Jupla - Mitglied
- Beiträge: 248
- Registriert: 13.06.2008, 18:52
- Wohnort: Bernburg
Re: Problem bei layout in dreamweaver
von pegger am 09.10.2008, 21:11
Ingo hat geschrieben:Es gibt 2 Wege:
Der kurze, aber nicht so elegante: Ändere die CSS-Angaben im Kopf der HTML-Datei, genaue Werte
sind auch (nicht nur) Geschmacksfrage - ausprobieren:
- Code: Alles auswählen
#Layer3 {
position:absolute;
left:384px; /* alternativ auch hier, ca. 100px weniger */
top:194px;
width:605px; /* HIER, war 705px */
height:452px;
z-index:1;
}
Das sollte eigentlich den "Überlauf" verhindern. Bitte mal ausprobieren, falls noch keine andere Lösung
geholfen hat.
Der lange, aber mittelfristig ganz sicher bequemere Weg ist der, den Eyecatcher ansprach: Umstellen
des Quelltextes auf Div-Layouts statt Tabellen. Tabellengestützte Quelltexte sind auf Dauer unübersichtlich
und im Detail oft nur mit viel Fingerspitzengefühl veränderbar - kurz: wenig wartungsfreundlich.
Die Einarbeitung/Umgewöhnung an Divs ist zwar lästig, rentiert sich aber mit Sicherheit.
Gruß, Ingo
Hab mal den einfachen Weg gewählt, bei meiner Mutter auf dem Laptop ist das Problem nun beseitigt, bei meinem Bruder steht die Schrift nun sehr weit Links (vorher rechts) liegt das an dem Monitor (22" flat) oder??? hab übrigens die 384 zu 284 px gemacht
- pegger
- Mitglied
- Beiträge: 8
- Registriert: 09.10.2008, 19:40
Re: Problem bei layout in dreamweaver
von Ingo am 09.10.2008, 21:27
Hm. Stimmt, da fehlt noch der Bezug für das #Layer3. Im HTML bitte folgendes ändern:
1. Das äußere Div (das bis jetzt nur align="center" hat) mit einer ID versehen. Dabei die Div-Zeile nach unten
verschieben, direkt unterhalb <body>. Ganz am Schluss vor </body> ein </div> einfügen, das fehlt da nämlich:
2. Dann im CSS-Teil folgenden Absatz einfügen (danach sollte align="center" nicht mehr nötig sein):
Bin gespannt.
1. Das äußere Div (das bis jetzt nur align="center" hat) mit einer ID versehen. Dabei die Div-Zeile nach unten
verschieben, direkt unterhalb <body>. Ganz am Schluss vor </body> ein </div> einfügen, das fehlt da nämlich:
- Code: Alles auswählen
<body ... >
<div align="center" id="alles"> <!-- id="alles" einfügen -->
<div id="Layer3"> ... </div>
<table>... </table>
</div> <!-- Dieses Tag fehlt noch -->
</html>
2. Dann im CSS-Teil folgenden Absatz einfügen (danach sollte align="center" nicht mehr nötig sein):
- Code: Alles auswählen
#alles
{
position:relative; /* ! */
width:1025px;
margin:auto;
}
Bin gespannt.
Die beste Browserweiche ... sitzt zwischen den Ohren ;o]
-
Ingo - Moderator
- Beiträge: 696
- Registriert: 01.04.2007, 23:21
- Wohnort: Neuss/NRW
Re: Problem bei layout in dreamweaver
von pegger am 09.10.2008, 21:37
Sorry der dummen nachfrage aber wo im code genau soll der erste "code oder tag" von dir hin? finde die stelle nicht
- pegger
- Mitglied
- Beiträge: 8
- Registriert: 09.10.2008, 19:40
Re: Problem bei layout in dreamweaver
von Ingo am 09.10.2008, 21:48
(Hehe, genau das ist eines der Probleme: Tabellencode ist relativ unübersichtlich 
)
Anbei mal die angepasste HTML-Datei (ich habe ein paar Kommentare eingefügt.)
Wir haben hier übrigens ein sehr passables Tutorial zum Thema: Div-Layer und CSS
Gruß, Ingo
)Anbei mal die angepasste HTML-Datei (ich habe ein paar Kommentare eingefügt.)
Wir haben hier übrigens ein sehr passables Tutorial zum Thema: Div-Layer und CSS
Gruß, Ingo
- Dateianhänge
-
wirueberuns.zip- (1.97 KiB) 2-mal heruntergeladen
Die beste Browserweiche ... sitzt zwischen den Ohren ;o]
-
Ingo - Moderator
- Beiträge: 696
- Registriert: 01.04.2007, 23:21
- Wohnort: Neuss/NRW
18 Beiträge • Seite 1 von 2 • 1, 2
Wer ist online?
Mitglieder in diesem Forum: 0 Mitglieder und 1 Gast