einfach <pre> nutzen

Siehe https://www.mediaevent.de/xhtml/pre.html

Wenn man einem Element in CSS einen Border, Padding oder Margin gibt, so weitet sich das Element aus. Befindet sich ein anderes Element daneben, so muss die Breite und Höhe dieses Elementes ebenfalls angepasst werden.

Dafür gibt es einen netten Trick.
[crayon-676707683870d925457482/]
 

 

Ich mach hier mal eine kleine Sammlung von Javascript Bibliotheken, die ich vielleicht eines Tages gebrauchen kann.

Forms

Alternative Select Boxen

https://select2.github.io/examples.html

https://twitter.github.io/typeahead.js/

https://harvesthq.github.io/chosen/

http://rmm5t.github.io/jquery-flexselect/

http://loopj.com/jquery-tokeninput/

https://tympanus.net/codrops/2014/07/10/inspiration-for-custom-select-elements/

https://tympanus.net/Tutorials/CustomDropDownListStyling/index2.html#

Multiple Select

http://loudev.com/#demos

Datepicker

https://uxsolutions.github.io/bootstrap-datepicker/

 

http://amsul.ca/pickadate.js/

https://fullcalendar.io/

http://felicegattuso.com/projects/timedropper/

Daterange:

http://www.daterangepicker.com/#examples

http://rettica.com/caleran/docs/readme.html#caleran-date-range-picker

Tables

http://issues.wenzhixin.net.cn/bootstrap-table/

http://listjs.com/

Modal, PopUp

http://dimsemenov.com/plugins/magnific-popup/

http://codeseven.github.io/toastr/demo.html

http://likeastore.github.io/ngDialog/#

http://qtip2.com/

List shortcuts: https://www.impressivewebs.com/demo-files/question-mark-js/

Treeview

https://www.jstree.com/

Drag & Drop

http://rubaxa.github.io/Sortable/

https://bevacqua.github.io/dragula/

http://vishalok12.github.io/jquery-dragarrange/

Charts, Diagramme, Grafiken

https://d3js.org/

d3 Components: http://plottablejs.org/components/

http://www.chartjs.org/

http://gionkunz.github.io/chartist-js/

http://nvd3.org/examples/index.html

http://visjs.org/

http://sigmajs.org/

http://c3js.org/

http://dc-js.github.io/dc.js/

http://code.shutterstock.com/rickshaw/

https://sbstjn.com/timesheet.js/#light

https://www.javascripting.com/view/stats-js

http://www.humblesoftware.com/flotr2

PDF

Generate PDF: https://mozilla.github.io/pdf.js/

PDF Print: http://printjs.crabbly.com/

http://pdfobject.com/examples/index.php

 

Animation

https://daneden.github.io/animate.css/

http://github.hubspot.com/pace/docs/welcome/

http://timeline.knightlab.com/#overview

https://connoratherton.com/loaders

File Management

http://blueimp.github.io/jQuery-File-Upload/index.html

https://fineuploader.com/demos.html

http://www.dropzonejs.com/

PDF Creator

https://parall.ax/products/jspdf

http://pdfmake.org/#/

Data Management

http://okfnlabs.org/recline/demos/

Object Binding, DOM Manipulating, Templating

https://lodash.com/

 

http://tempojs.com/

https://github.com/lhorie/mithril.js

http://requirejs.org/

LazyLoading: http://callmecavs.com/layzr.js/

https://monkberry.js.org/

https://svelte.technology/

Template (mit Mustache Syntax)

http://mustache.github.io/

http://handlebarsjs.com/

https://ractive.js.org/api/

String Tools:

http://www.benalman.com/projects/jquery-replacetext-plugin/

Code Management

https://highlightjs.org/

AutoComplete: https://www.javascripting.com/view/jquery-autocomplete

Validation

http://is.js.org/

http://rickharrison.github.io/validate.js/

Telephone Country Validator: http://intl-tel-input.com/

WYSIWYG editor

https://quilljs.com/

http://summernote.org/

Photo Editor, Photo Gallery

http://photoswipe.com/

Maps

http://openlayers.org/

http://datamaps.github.io/

http://leafletjs.com/

UI Framework

https://getuikit.com/docs/button

http://mmenu.frebsite.nl/

mit Height/Width kann man die Größe der Box in Prozent, Pixel etc. angeben. Diese Werte richten sich je nach Position auf den Container selbst.

Neu ist das viewport-height bzw viewport-width, welche in Bezug zu dem Browserfenster steht.

diese lassen sich so festlegen:

Height:100 vh;

Width: 100vw;

Dies Prozentual werte, welche sich unter anderem in absoluten Position eignet