Top-Themen

Aktuelle Themen (A bis Z)

Administrator.de FeedbackApache ServerAppleAssemblerAudioAusbildungAuslandBackupBasicBatch & ShellBenchmarksBibliotheken & ToolkitsBlogsCloud-DiensteClusterCMSCPU, RAM, MainboardsCSSC und C++DatenbankenDatenschutzDebianDigitiales FernsehenDNSDrucker und ScannerDSL, VDSLE-BooksE-BusinessE-MailEntwicklungErkennung und -AbwehrExchange ServerFestplatten, SSD, RaidFirewallFlatratesGoogle AndroidGrafikGrafikkarten & MonitoreGroupwareHardwareHosting & HousingHTMLHumor (lol)Hyper-VIconsIDE & EditorenInformationsdiensteInstallationInstant MessagingInternetInternet DomäneniOSISDN & AnaloganschlüsseiTunesJavaJavaScriptKiXtartKVMLAN, WAN, WirelessLinuxLinux DesktopLinux NetzwerkLinux ToolsLinux UserverwaltungLizenzierungMac OS XMicrosoftMicrosoft OfficeMikroTik RouterOSMonitoringMultimediaMultimedia & ZubehörNetzwerkeNetzwerkgrundlagenNetzwerkmanagementNetzwerkprotokolleNotebook & ZubehörNovell NetwareOff TopicOpenOffice, LibreOfficeOutlook & MailPapierkorbPascal und DelphiPeripheriegerätePerlPHPPythonRechtliche FragenRedHat, CentOS, FedoraRouter & RoutingSambaSAN, NAS, DASSchriftartenSchulung & TrainingSEOServerServer-HardwareSicherheitSicherheits-ToolsSicherheitsgrundlagenSolarisSonstige SystemeSoziale NetzwerkeSpeicherkartenStudentenjobs & PraktikumSuche ProjektpartnerSuseSwitche und HubsTipps & TricksTK-Netze & GeräteUbuntuUMTS, EDGE & GPRSUtilitiesVB for ApplicationsVerschlüsselung & ZertifikateVideo & StreamingViren und TrojanerVirtualisierungVisual StudioVmwareVoice over IPWebbrowserWebentwicklungWeiterbildungWindows 7Windows 8Windows 10Windows InstallationWindows MobileWindows NetzwerkWindows ServerWindows SystemdateienWindows ToolsWindows UpdateWindows UserverwaltungWindows VistaWindows XPXenserverXMLZusammenarbeit

gelöst Mehrere divs über img legen

Mitglied: Badger

Badger (Level 2) - Jetzt verbinden

18.03.2014, aktualisiert 19.03.2014, 1513 Aufrufe, 9 Kommentare

Hallo Leute,

ich steh gerade total an und würde mich über eure Hilfe freuen.

Und zwar muss ich mehrere Divs über ein Image legen.
Um das Ganze zu veranschaulichen habe ich jetzt mal auf die schnelle einen Teil der Webseite auf jsfiddle nachgebaut.

Mit nur einem Div funktioniert das ganze ja ohne Probleme.
Sobald aber 2 Divs (oder mehr) darüber liegen (bitte dazu im jsfiddle Kommentar aus Zeile 12 entfernen), klappt es nicht mehr.
Die Abstände werden hier total verschoben.

Was bedenke ich da jetzt zur späten Stunde nicht mehr?

Beste Grüße
Patrick
Mitglied: certifiedit.net
18.03.2014 um 23:18 Uhr
Hallo Patrick,

vermutlich, dass das sich die Divs auch Gegenseitig beeinflussen?

Gruß,

Christian
Bitte warten ..
Mitglied: Badger
19.03.2014 um 07:35 Uhr
Zitat von certifiedit.net:

Hallo Patrick,

vermutlich, dass das sich die Divs auch Gegenseitig beeinflussen?

Gruß,

Christian

Das war mir irgendwie fast klar ;)

Aber wie behebe ich diese Beeinflussung?

Grüße
Patrick
Bitte warten ..
Mitglied: d4shoerncheN
19.03.2014 um 09:10 Uhr
Guten Morgen,

hat es einen bestimmten Grund wieso du den Hintergrund der Box als Bild einbindest und nicht den <div> Container dein Bild als Hintergrund zuweist? Zudem würde ich dir nicht empfehlen deinen <div> im Quelltext Formatierungen zuzuweisen (float: left z. B.), sondern direkt im CSS.

Wenn du bestimmte Elemente gesondert behandeln willst, kannst du bei Listen z. B. mit first- und last-child arbeiten.

Gruß
Toni
Bitte warten ..
Mitglied: Badger
19.03.2014 um 09:18 Uhr
Zitat von d4shoerncheN:

Guten Morgen,

Morgen Toni,

hat es einen bestimmten Grund wieso du den Hintergrund der Box als Bild einbindest und nicht den <div> Container dein Bild
als Hintergrund zuweist?

Ja. Das div hat eine bestimmte Breite. Das eingebundene Bild kann jedoch auch breiter sein als das div. Dann muss der Inhalt im div (also das Bild) scrollbar sein.
Darum habe ich das so gelöst.

Zudem würde ich dir nicht empfehlen deinen <div> im Quelltext Formatierungen zuzuweisen
(float: left z. B.), sondern direkt im CSS.
Mache ich auch prinzipiell. War hier nur als Beispiel. Aber Danke für den Hinweis.

Wenn du bestimmte Elemente gesondert behandeln willst, kannst du bei Listen z. B. mit first- und last-child arbeiten.
Prinzipiell ist mir diese (css) Funktion bekannt. Allerdings ist mir jetzt nicht klar, wie mir das in meinem Fall weiterhelfen kann.

Grüße
Patrick
Bitte warten ..
Mitglied: colinardo
LÖSUNG 19.03.2014, aktualisiert um 17:58 Uhr
Hallo Patrick,
deine Positionierung (relativ/absolut) der DIVs hat nicht gestimmt. Update: http://jsfiddle.net/c9cd6/1/

Grüße Uwe
Bitte warten ..
Mitglied: Badger
19.03.2014 um 09:29 Uhr
Zitat von colinardo:

Hallo Patrick,
deine Positionierung (relativ/absolut) der DIVs hat nicht gestimmt. Update: http://jsfiddle.net/c9cd6/1/

Grüße Uwe

Super, danke dir!
Muss mir aber noch anschauen, ob mit dem "position:relative" im div#preview mir nicht mein restliches Design gecrasht wird. Aber das hoffe ich ja doch nicht.
Werde am Abend berichten!
Bitte warten ..
Mitglied: d4shoerncheN
19.03.2014 um 09:30 Uhr
Moin,

Ja. Das div hat eine bestimmte Breite. Das eingebundene Bild kann jedoch auch breiter sein als das div. Dann muss der Inhalt im div (also das Bild) scrollbar sein.
ach so. Okay.

Mache ich auch prinzipiell. War hier nur als Beispiel. Aber Danke für den Hinweis.
Gut.

Prinzipiell ist mir diese (css) Funktion bekannt. Allerdings ist mir jetzt nicht klar, wie mir das in meinem Fall weiterhelfen kann.
Da du leider keine Information gegeben hast was damit gemacht wird, war es nur ein Vorschlag. Wenn du so z. B. hättest eine Navigation bauen wollen.

Aber @colinardo hat oben ja die Lösung gepostet für deinen Quelltext.

Gruß
Toni
Bitte warten ..
Mitglied: colinardo
19.03.2014, aktualisiert um 09:32 Uhr
Zitat von Badger:
Super, danke dir!
Muss mir aber noch anschauen, ob mit dem "position:relative" im div#preview mir nicht mein restliches Design gecrasht wird
und wenn, baust du einfach einen weiteren DIV drum und positionierst diesen dann halt absolut, wenn das die Anforderung ist
Bitte warten ..
Mitglied: Badger
19.03.2014 um 17:57 Uhr
Zitat von colinardo:

Hallo Patrick,
deine Positionierung (relativ/absolut) der DIVs hat nicht gestimmt. Update: http://jsfiddle.net/c9cd6/1/

Grüße Uwe

Klappte so auf Anhieb.

Herzlichen Dank Uwe und Toni für eure Hilfe!
Bitte warten ..
Ähnliche Inhalte
PHP

Inhalt eines divs ohne Javascript ändern!

gelöst Frage von LordKimahriPHP5 Kommentare

Ich suche derzeit nach einer brauchbaren alternative mein "Content-Div" per klick auf einen Link mit Inhalt zu versorgen, derzeit ...

Backup

BackUp Exec2015 IMG Verzeichnisse

Frage von gruener.pumaBackup

Hallo, leider löscht unser BackUpExec die abgelaufenen Mediensätze nicht mehr automatisch, keine Veränderung der Einstellungen was seit Monaten funktioniert ...

Linux Tools

.img auf einem Synology NAS entpacken

Frage von adminstLinux Tools1 Kommentar

Hallo zusammen Ich habe ein dd Image von einem Ubuntu auf einem Synology NAS abgelegt. Jetzt ist der Fall, ...

Windows Installation

.img Backups bootfähig machen

Frage von MksMlrWindows Installation8 Kommentare

Hallo liebe Gemeinde, ich würde gerne von einem Rechner z.B. Windows 98 ein Image erstellen mit z.B Acronis True ...

Neue Wissensbeiträge
Humor (lol)

WhatsApp-Nachrichten endlich auch per Bluetooth versendbar

Information von BassFishFox vor 5 StundenHumor (lol)1 Kommentar

Genau darauf habe ich gewartet! ;-) Der beliebte Messaging-Dienst WhatsApp erhält eine praktische neue Funktion: Ab dem nächsten Update ...

Google Android

Googles "Android Enterprise Recommended" für Unternehmen

Information von kgborn vor 18 StundenGoogle Android3 Kommentare

Hier eine Information, die für Administratoren und Verantwortliche in Unternehmen, die für die Beschaffung und das Rollout von Android-Geräten ...

Sicherheit

Intel gibt neue Spectre V2-Microcode-Updates frei (20.02.2018)

Information von kgborn vor 18 StundenSicherheit

Intel hat zum 20. Februar 2018 weitere Microcode-Updates für OEMs freigegeben, um Systeme mit neueren Prozessoren gegen die Spectre ...

Microsoft
ARD-Doku - Das Microsoft Dilemma
Tipp von Knorkator vor 21 StundenMicrosoft3 Kommentare

Hallo zusammen, vor einigen Tagen lief in der ARD u.a. Reportage. Das Youtube Video dazu dürfte länger verfügbar sein. ...

Heiß diskutierte Inhalte
Windows Server
AD DS findet Domäne nicht, behebbar?
Frage von schapitzWindows Server40 Kommentare

Guten Tag, ich habe bei einem Kunden ein Problem mit den AD DS. Umgebung ist folgende: Windows Server 2016 ...

Router & Routing
LANCOM VPN CLIENT einrichten
Frage von Finchen961988Router & Routing27 Kommentare

Hallo, ich habe ein Problem und hoffe ihr könnt mir helfen, wir haben einen Kunden der hat einen Speedport ...

Router & Routing
ISC DHCP 2 Subnetze
gelöst Frage von janosch12Router & Routing19 Kommentare

Hallo, ich betreibe bei mir im Netzwerk einen ISC DHCP Server auf Debian, der DHCP verwaltet aktuell ein /24 ...

Switche und Hubs
Cisco SG350X-48 AdminIP in anderes VLAN
Frage von lcer00Switche und Hubs14 Kommentare

Hallo zusammen, ich habe ein Problem mir einem Cisco SG350X-48 bei der Erstinstallation wurde eine IP 192.168.0.254 (Default VLAN ...