| Autor |
Nachricht |
Partychopper
Threadersteller
Dabei seit: 27.11.2003
Ort: Offenburg
Alter: 43
Geschlecht: 
|
Verfasst Fr 11.07.2008 13:14
Titel Probleme mit HTML-Newsletter |
  |
|
Liebe Freunde des Quellcodes,
da man bei Newslettern ja keine DIVs verwenden soll, sondern eher Tabellen-Layouts mit Inline-CSS tue ich mir mit dem Layout etwas schwer.
Hier das Problem:
ich habe eine 3-zeilige und 2-Spaltige Tabelle für den Inhalt.
1. Zeile: Colspan=2 -> es soll links unten ein Firmenname stehen mit 10px Abstand von linkem und unterem Zellenrand. Rechts in der gleichen Zelle soll ein Logo stehen, das sich rechts oben direkt am Zellenrand ausrichtet.
2. Zeile: Colspan=2 -> dient als 5px-Abstandshalter (vertikal) von der Headergrafik
3. Zeile: Colspan=2 -> es wird ein Header-Bild über die gesamte Breite (700px) eingefügt
4. Zeile: in linker Zelle in ein Bild mit 100px Breite, in rechte Zelle kommt der Inhalt mit 600px Breite
Lösungs-Ansatz:
Ich habe versucht die obere Zeile in 2 Spalten zu belassen. Dann könnte ich den Namen in die linke Zelle tun und diese separat mit Styles versehen und das Logo in die rechte Zelle.
Wenn ich das mache dann habe ich wieder folgendes Problem:
Der Name (1.Zeile, linke Spalte) ist breiter als die 100px, die das Logo (3. Zeile, linke Zelle) hat.
Somit vergrößert der Inhalt der 1. Zeile die Zellenbreite auch in der 3. Zeile, was ich vermeiden möchte.
Wie geht man sowas an???
Hier mal der Code:
| Code: | <body>
<table width="700" height="560" cellspacing="0" cellpadding="0" style="border-top: 1px solid #666666; border-bottom: 1px solid #666666; border-left: 1px solid #666666; border-right: 1px solid #666666;">
<tr>
<td height="75" colspan="2" bgcolor="#FFFFFF" style="padding-left:10px;">
<span style="color:#FF6600; font-family:Arial, Helvetica, sans-serif; font-size:16px; display:block; float:left"> PROBLEMTEXT </span> <img src="Stuff/logo.gif" width="70" height="70" align="right" /></td>
</tr>
<tr>
<td height="5" colspan="2" bgcolor="#FFFFFF"></td>
</tr>
<tr>
<td height="80" colspan="2"><img src="Stuff/header_image.jpg" width="700" height="80" /></td>
</tr>
<tr>
<td height="400" width="100"><img src="Stuff/image_links.jpg" width="100" height="400" /></td>
<td width="600"> </td>
</tr>
</table>
</body> |
Zuletzt bearbeitet von Partychopper am Fr 11.07.2008 13:17, insgesamt 1-mal bearbeitet
|
|
| |
   |
 |
Nici_116
Dabei seit: 03.03.2006
Ort: Berlin
Alter: 39
Geschlecht: 
|
Verfasst Fr 11.07.2008 16:05
Titel
|
|
|
in welchen browser hast du dir denn das angesehen? wenn ichd as in firefox kontrolliere siehts eigentlich gut aus.
also die linke spalte, 3 zeile bleibt 100 px breit. der text 1 zeile ist länger...
oder hab ich was falsch verstanden? :ka:
|
|
| |
|
|
|
Anzeige
|
|
|
Nici_116
Dabei seit: 03.03.2006
Ort: Berlin
Alter: 39
Geschlecht:
|
Verfasst Fr 11.07.2008 16:07
Titel
|
|
|
|
auch ie 7 hat keine probs mit der darstellung. ich glaub ichhabs falsch verstanden .... :?
|
|
| |
|
|
Partychopper
Threadersteller
Dabei seit: 27.11.2003
Ort: Offenburg
Alter: 43
Geschlecht:
|
Verfasst Fr 11.07.2008 16:57
Titel Hmmm ja... |
|
|
ja da hast du was falsch verstanden (ist ja aber auch nicht ganz so einfach)... 
Also mein Problem ist, dass der Text in der 1. Zeile links unten in der Zelle stehen soll (steht momentan links oben) mit 10px Abstand zum Rand.
Und das Bild soll rechtsbündig ganz oben stehen, ohne dass da obendran noch 2 komische ungewünschte Pixel weiß bleiben.
Und das alles in einer Zelle zu formatieren hab ich nich hinbekommen. Und in zwei Spalten (Ohne Colspan) geht nicht, weil dann die linke Zelle des Textes wieder die in der 3. Zeile mit-vergrößern würde, was ich vermeiden will.
Nu hab ich das mit nem <Span>-Tag probiert, den als ein Blockelement definiert, das Teil gefloated... nichts bringt das gewünschte Ergebnis...
Wobei ich ehrlich zugeben muss, dass ich mich da auch noch sehr schlecht auskenne... 
Zuletzt bearbeitet von Partychopper am Fr 11.07.2008 16:58, insgesamt 1-mal bearbeitet
|
|
| |
|
|
escaPe
Dabei seit: 10.09.2007
Ort: <? include("home.htm") ?>
Alter: 112
Geschlecht:
|
Verfasst Fr 11.07.2008 17:43
Titel
|
|
|
machs mit 4 spalten wie folgt:
damit kannst du die größe oben verändern ohne die unten zu verändern
und zusätzlich hast du 2 tabellen zellen die du unterschiedlich formatieren kannst
zum problem: ungewünschte freie pixel einfach mit margin/padding minus werten arbeiten
also "margin-top:-2px;" zum Beispiel
Zuletzt bearbeitet von escaPe am Fr 11.07.2008 17:47, insgesamt 3-mal bearbeitet
|
|
| |
|
|
top
Moderator
Dabei seit: 25.11.2003
Ort: Hedwig Holzbein
Alter: 52
Geschlecht:
|
Verfasst Fr 11.07.2008 18:42
Titel
|
|
|
|
colspan und rowspan machen gerne mal Probleme. Versuch es sonst mit ineinander verschachtelten Tabellen.
|
|
| |
|
|
bacon
Dabei seit: 24.10.2007
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 11.07.2008 20:23
Titel
|
|
|
| top hat geschrieben: | | colspan und rowspan machen gerne mal Probleme. Versuch es sonst mit ineinander verschachtelten Tabellen. |
Eigentlich nur, wenn man des Abzählens nicht mächtig ist, oder?
|
|
| |
|
|
Partychopper
Threadersteller
Dabei seit: 27.11.2003
Ort: Offenburg
Alter: 43
Geschlecht:
|
Verfasst Sa 12.07.2008 11:15
Titel
|
|
|
| escaPe hat geschrieben: | machs mit 4 spalten wie folgt:
damit kannst du die größe oben verändern ohne die unten zu verändern
und zusätzlich hast du 2 tabellen zellen die du unterschiedlich formatieren kannst
|
>>> Also die Grafik verstehe ich nicht ganz. Deine Colspans breiten sich ja nur über eine Zelle aus. Der iegentlich Sinn von Colspan ist doch zwei Zellen zu einer zusammenzufassen, oder? 
| escaPe hat geschrieben: |
zum problem: ungewünschte freie pixel einfach mit margin/padding minus werten arbeiten
also "margin-top:-2px;" zum Beispiel
|
>>> Also muss man in diesem Fall nicht hinterfragen, wo diese unerwünschten 2 pixel überhaupt herkommen?
Vielleicht liegt es am fehlenden Border-Collapse??? 
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
HTML/ Newsletter <--> Flash Newsletter?
Newsletter in HTML
HTML-Newsletter
HTML-Newsletter am Mac
html newsletter
html newsletter??? -hilfe-
|
|
Willkommen auf dem Portal für Mediengestalter
