On this page you will find a lot of developer tools and
guides which can
be useful for your daily work.
This collection is continually being expanded.
Beautiful color arrangements with live preview and all needed css code,
Password Hash generator for php BasicAuth library,
CSS Shadow Code Generator,
Password SHA1 Hash Generator,
Password MD5 Hash Generator,
Password Generator with several options.
The white box is the parent container
The little violet boxes are the childs
Define an element as flexbox container
.box {
display: flex; /* you can also display: inline-flex; */
}
Defines order of childs
.box-item1 {
order: 3;
}
.box-item3 {
order: -1;
}
Defines direction of elements within container
.box {
flex-direction: column; /* you can also flex-direction: column-reverse; */
}
.box {
flex-direction: row-reverse; /* you can also flex-direction: row; */
}
Defines width of childs
.box-item1 {
flex-grow: 2;
}
Defines direction of elements within container
.box {
flex-flow: column; /* you can also flex-flow: column-reverse; */
}
.box {
flex-flow: row-reverse; /* you can also flex-flow: row; */
}
Defines width of single childs
.box-item1 {
flex-shrink: 2;
}
Defines wrap settings of elements within container
.box {
flex-wrap: wrap; /* you can also flex-wrap: nowrap; */
}
.box {
flex-wrap: wrap-reverse;
}
Defines initial width of single flex-child
.box-item1 {
flex-basis: 50px;
}
.box-item1 {
width: 50px;
flex-basis: auto; /* auto use the width value */
}
Defines alignment of elements within container
.box {
justify-content: flex-end; /* flex-start or center are other possibilities */
}
.box {
justify-content: space-around;
}
.box {
justify-content: space-between;
}
Defines and overrides alignment of single flex-child
.box-item1 {
align-self: center; /* you can use also align-self: baseline or stretch; */
}
.box-item3 {
align-self: flex-end; /* you can use also align-self: flex-start; */
}
Defines alignment of elements within container
.box {
align-items: flex-end; /* flex-start, baseline, stretch or center are other possibilities */
}
.box {
align-items: center;
}
Defines alignment of elements within container
.box {
align-content: flex-end; /* flex-start, stretch, space-between, space-around or center are other possibilities */
}
.box {
align-content: space-between;
}
.box {
align-content: space-around;
}
See all your browser client information, feature supports and more in one view and send right here via email to your designer or agentur
Check hereUse this simple CSV file uploader and print the result within your browser directly. Print you CSV file here in 2 Steps. Upload and print!
Upload hereLive Password Security Level Checker and Password or token generator with several options
lets analyzeA salted hash generator with some crypt algorithm options, useful for php BasicAuth Library
look hereA password and token generator with several options, useful for everything
look hereCreates 32 char long MD5 hashes to reset Database Passwords in older versions of Drupal or similar software
look here© www.developer-tools.net 2020 | Imprint | Privacy policy