[GastForen Web allgemein HTML und CSS / Stylesheets Tabelle mit DIVs simulieren

  • Suche
  • Hilfe
  • Lesezeichen
  • Benutzerliste
Themen
Beiträge
Moderatoren
Letzter Beitrag

Tabelle mit DIVs simulieren

Wolfgang Reszel
Beiträge gesamt: 4170

12. Okt 2005, 10:42
Beitrag # 1 von 5
Bewertung:
(2202 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hi,

ich möchte bei einer Auflistung von Adressen links von den Adressen immer ein Adresssymbol haben (siehe Anhang). Ist das auch ohne Tabellen möglich? Ich habe es mit zwei DIVs probiert.

Code
.vcard{position:relative;width:40px;height:40px} 
.adresse{position:relative;top:-40px;left:40px}


Das Problem ist, dass die 40px nach oben Schieben nicht den folgenden Text nachrücken lassen, also eine 40px-Lücke entsteht.

Anhang:
div-table.png (4.64 KB)
X

Tabelle mit DIVs simulieren

SabineP
Beiträge gesamt: 7586

12. Okt 2005, 11:10
Beitrag # 2 von 5
Beitrag ID: #190759
Bewertung:
(2199 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Wolfgang,

mit CSS ist das möglich.
Zum Beispiel sind die Ordnersymbole in der Forenübersichtsseite Hintergrundbilder.
http://www.hilfdirselbst.ch/foren/gforum.cgi

Hier noch ein Beispielcode:

Mit
padding-left:Wert in Pixel
wird der Text relativ zum Hintergrundbild nach rechts verschoben.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<TITLE>Titletext</TITLE>

<style type="text/css">
div {padding-left:20px; background-image:url(adresssymbol.gif);background-repeat:no-repeat;}
</style>

</HEAD>

<BODY>
<div>Text Text Text Text Text</div>
</BODY>

</HTML>

Gruß Sabine


als Antwort auf: [#190744]

Tabelle mit DIVs simulieren

Wolfgang Reszel
Beiträge gesamt: 4170

12. Okt 2005, 12:11
Beitrag # 3 von 5
Beitrag ID: #190773
Bewertung:
(2197 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Danke Sabine,

leider sollen die Bilder auch mit einem Link hinterlegt werden. Die Frage ist ja auch mehr generell gemeint. Wie stelle ich zwei DIVs nebeneinander und das relativ zum Umfeld.


als Antwort auf: [#190759]

Tabelle mit DIVs simulieren

SabineP
Beiträge gesamt: 7586

12. Okt 2005, 13:40
Beitrag # 4 von 5
Beitrag ID: #190802
Bewertung:
(2187 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Mit float:left bekommt man zwei DIVs nebeneinander.

Noch ein Beispiel dazu, allerdings habe ich darauf verzichtet das Bild in ein Div zu packen:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>nebeneinander</title>
<style type="text/css">
#links {float:left; width:40px; height:40px}
#rechts {margin-left:50px}
</style>
</head>
<body>
<img src="bild.gif" id="links">
<div id="rechts">Text Text Text Text Text Text Text Text Text Text Text Text </div>
</body>
</html>

Gruß Sabine


als Antwort auf: [#190773]
(Dieser Beitrag wurde von SabineP am 12. Okt 2005, 13:41 geändert)

Tabelle mit DIVs simulieren

Wolfgang Reszel
Beiträge gesamt: 4170

12. Okt 2005, 14:02
Beitrag # 5 von 5
Beitrag ID: #190809
Bewertung:
(2183 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hi,

danke, wenn ich aber statt dem IMG ein weiteres DIV verwende wird trotzdem im IE noch leicht der Text eingerückt, egal ob das zweite DIV zehn Kilometer rechts steht oder knapp dran. Ich geb's jetzt auf und mache wie gewohnt mit Tabellen weiter.


als Antwort auf: [#190802]
X

Aktuell

Veranstaltungskalender

Hier können Sie Ihre Anlässe eintragen, welche einen Zusammenhang mit den Angeboten von HilfDirSelbst.ch wie z.B. Adobe InDesign, Photoshop, Illustrator, PDF, Pitstop, Affinity, Marketing, SEO, Büro- und Rechtsthemen etc. haben. Die Einträge werden moderiert freigeschaltet. Dies wird werktags üblicherweise innert 24 Stunden erfolgen.

pdf-icon Hier eine kleine Anleitung hinsichtlich Bedeutung der auszufüllenden Formularfelder.

Veranstaltungen
14.05.2024

Online
Dienstag, 14. Mai 2024, 10.00 - 10.30 Uhr

Webinar

Prozessoptimierung ist ein Teamsport! Keine Software und keine Maschine allein kann Ihnen helfen, die Effizienzpotenziale Ihres Betriebes maximal auszuschöpfen. Von der Auftragsannahme über die Vorstufe und den Druck bis hin zur Weiterverarbeitung – alles muss optimal ineinandergreifen. Apropos Weiterverarbeitung – in vielen Druckbetrieben fristet sie in Sachen Prozessoptimierung immer noch ein Schattendasein. Dabei liegen hier mittlerweile die größten Einsparpotenziale! In einem Webinar von Horizon und Impressed erfahren Sie, wie Sie diese Einsparungen realisieren können. Horizon, bekannt für innovative Lösungen in der Druckweiterverarbeitung, bietet mit iCE LiNK eine Workflowlösung für die Weiterverarbeitung. iCE LiNK überwacht, visualisiert und analysiert Produktionsabläufe und unterstützt bei der Wartung – damit immer alles reibungslos läuft. Den gleichen Anspruch hat der von Impressed entwickelte Impressed Workflow Server – er ist die smarte PDF-Workflow-Lösung für Druckereien, die Datenmanagement, Preflight und Produktionssteuerung übernimmt. Im Webinar zeigen Ihnen die Experten von Horizon und Impressed, wie beide Lösungen im Team die Effizienz und Produktivität Ihres Betriebes steigern können. Melden Sie sich am besten gleich an, wir freuen uns auf Sie! PS: Melden Sie sich in jedem Fall an – sollten Sie zum Termin verhindert sein, erhalten Sie die Aufzeichnung.

kostenlos

Ja

Organisator: Impressed / Horizon

https://www.impressed.de/schulung.php?c=sDetail&sid=327

Einsparpotenziale in der Weiterverarbeitung
Veranstaltungen
16.05.2024

Online
Donnerstag, 16. Mai 2024, 10.00 - 10.30 Uhr

Webinar

Komplizierte, kleinteilige Aufträge; alles sehr speziell; seit Jahren bewährte Prozesse – da können wir nichts standardisieren und automatisieren! Das sagen viele Großformatdrucker – aber stimmt das wirklich, ist dem tatsächlich so? Günther Business Solutions und Impressed treten in einem Webinar den Gegenbeweis an. Experten beider Unternehmen zeigen, wie Großformatdrucker vom Einsatz zweier bewährter Lösungen profitieren können: • von advanter print+sign von Günther Business Solutions, dem ERP-System für den Großformatdruck, dass alle Phasen der Wertschöpfung im Large Format Printing abdeckt • von Impressed Workflow Server, der smarten PDF-Workflow-Lösung für Druckereien, die Datenmanagement, Preflight und Produktionssteuerung übernimmt Über die Kombination beider Lösungen können Großformatdrucker ihre Prozesse mit modernen Workflows Schritt für Schritt automatisieren – und so zügig deutliche Zeit- und Kosteneinsparungen realisieren. Das Webinar sollten Sie sich nicht entgehen lassen – damit Sie keine Effizienzpotenziale mehr liegen lassen. Melden Sie sich am besten gleich an, wir freuen uns auf Sie! PS: Melden Sie sich in jedem Fall an – sollten Sie zum Termin verhindert sein, erhalten Sie die Aufzeichnung.

kostenlos

Nein

Organisator: Impressed / Günther Business Solutions

https://www.impressed.de/schulung.php?c=sDetail&sid=326

Und es geht doch: Automatisierung im Großformatdruck!