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 Css div-Boxen nebeneinander

Mitglied: tsunami

tsunami (Level 1) - Jetzt verbinden

21.03.2019 um 09:31 Uhr, 344 Aufrufe, 2 Kommentare

Hallo,
ich habe Thema welches auf den ersten Blick mit unzähligen ähnlichen Ansätzen funktionieren soll, tut es aber nicht.
Ich möchte viele Div-Boxen mit unbekannter Breite nebeneinander anordnen.
Was ist die Idee? Es soll sowas wie ein Tagesablauf dargestellt werden. Also Was weiß ich 8-9 Frühstück, 9-10:25 Einkaufen, 10:25-11:30 Hausputz usw. Die Länge der Boxen soll die Zeitblöcke darstellen.

Das Problem: Mal ist der Tag um 22 Uhr zu Ende, mal um 23 Uhr, mal um 17 Uhr.
Sobald es lönger wie 17 Uhr geht, bricht float:left die folgenden Boxen um.
Darauf habe ich ein umgebenes DIV hinzugefügt und overflow-x:scroll dazugepackt, sowie eine feste Breite.Der Scrollbalken erscheint, scrollt aber nicht, sondern bricht um.
<code>div.hauptdiv
{
overflow:visible;
white-space:nowrap;
border:1px solid red;

}</code>
01.
 </head>
02.
  <body>
03.
  <div class="hauptdiv">
04.
<div class='uhrzeitzellel'>&nbsp;</div>
05.
<div class='uhrzeitzellel'>8:00</div>
06.
<div class='uhrzeitzellel'>9:00</div>
07.
<div class='uhrzeitzellel'>10:00</div>
08.
<div class='uhrzeitzellel'>11:00</div>
09.
<div class='uhrzeitzellel'>12:00</div>
10.
<div class='uhrzeitzellel'>13:00</div>
11.
<div class='uhrzeitzellel'>14:00</div>
12.
<div class='uhrzeitzellel'>15:00</div>
13.
<div class='uhrzeitzellel'>16:00</div>
14.
<div class='uhrzeitzellel'>17:00</div>
15.
<div class='uhrzeitzellel'>18:00</div>
16.
<div class='uhrzeitzellel'>19:00</div></div
Es gab die Idee mit nowrap, display in allen Varianten. Passiert ist aber nichts. Mit ner Tabellle habe ich es auch versucht, habe es aer nicht hinbekommen in jeder Zeille unterschiedliche Spaltenbreiten zu bekommen. Der obrige Code ist ein Teil. Die Breiten sind natürlich fix. Darunter kommen die Tätigkeiten mit den Variablen Längen. Aber erstmal wollte ich es grundsätzlich lösen...

Irgendwer eine Idee?
mfG
tsunami
Mitglied: 138810
LÖSUNG 21.03.2019, aktualisiert um 11:30 Uhr
Für solche Sachen gibt' schon länger das CSS GRID
https://www.w3schools.com/css/css_grid.asp
Bitte warten ..
Mitglied: tsunami
24.03.2019 um 10:40 Uhr
Danke! Das wars.
Bitte warten ..
Ähnliche Inhalte
HTML

Seitenwechsel innerhalb einer div-Box in HTML+CSS

gelöst Frage von honeybeeHTML7 Kommentare

Hallo, ich habe mit dem HTML-Tag <div> und CSS folgendes Webseitenschema erstellt: siehe Screenshot unten. Meine Frage: Wenn ich ...

CSS

Print CSS Div pro Seite und dynamischer Länge

Frage von tsunamiCSS6 Kommentare

Hallo zusammen, ich habe ein Problem: Und zwar habe ich eine dynamische Seite die per php generiert wird mit ...

CSS

Div zu übergeordnetem div ausrichten

gelöst Frage von tsunamiCSS2 Kommentare

Hallo, ich möchte sowas wie einen Tagesablauf dokumentieren. 1.2.19 usw. Das Ganze farblich mit Divs dargestellt. Soweit so gut. ...

CSS

CSS Problem

gelöst Frage von michi1983CSS2 Kommentare

Hallo Admins, eventuell kann mir ja hier einer weiterhelfen, ich stehe offenbar auf der Leitung. Auf folgender Website (die ...

Neue Wissensbeiträge
Windows Server

Active Directory ESE Version Store Changes in Server 2019

Information von Dani vor 4 StundenWindows Server

Moin, Last month at Microsoft Ignite, many exciting new features rolling out in Server 2019 were talked about. But ...

Exchange Server

Microsoft Extending End of Support for Exchange Server 2010

Information von Dani vor 4 StundenExchange Server

Moin, After investigating and analyzing the deployment state of an extensive number of Exchange customers we have decided to ...

Schulung & Training

Humble Book Bundle: Network and Security Certification 2.0

Tipp von NetzwerkDude vor 5 StundenSchulung & Training

Abend, bei HumbleBundle gibts mal wider ein schönes Paket e-books: sind verschiedene Zertifizierungen wie MCSA, CCNA, CompTIA etc., für ...

Voice over IP

Telekom Umstellung von ISDN Anlagenanschluss auf IP-Telefonie

Erfahrungsbericht von NixVerstehen vor 3 TagenVoice over IP7 Kommentare

Hallo zusammen, nachdem nun vor ein paar Tagen die zwangsweise Umstellung von ISDN auf IP-Telefonie problemlos über die Bühne ...

Heiß diskutierte Inhalte
Windows Server
Drucker auf dem Terminalserver 2016 via Printserver wird nicht angezeigt
Frage von EchterHansenWindows Server14 Kommentare

Moin Moin, ich habe hier zwei 2016er Terminalserver und einen 2016er Printserver, auf dem ca. 10 RICOH-Drucker Typ 4. ...

Hardware
Ncomputing N600 oder auch 600W Privat nutzen Kostenlos oder kostengünstig
gelöst Frage von PlerTanixHardware14 Kommentare

Hallo liebe Forum User, Ich habe da eine Frage. Ich bin Azubi im dritten Lehrjahr und bei uns in ...

Windows 10
Upgrade Windows 10 1903 und Office 2010 Problem mit Userzertifikaten
gelöst Frage von Looser27Windows 1012 Kommentare

Guten Morgen, ich habe bei uns ein Phänomen in o.g. Kombination festgestellt, welches nach dem Inplace-Upgrade auf 1903 auftritt. ...

Datenschutz
Onedrive, Dropbox, Google Drive und Co. sperren?
Frage von holliknolliDatenschutz10 Kommentare

Hallo, wir haben folgendes Problem: die oben gennannten Cloud-Storages. Die wollen wir für Mitarbeiter sperren, damit kein Wildwuchs entsteht, ...