D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
tomgp
Full window
Github gist
some css layouts I've used, an ongoing collection
<!DOCTYPE html> <html lang="en"> <head> <title>CSS layouts</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <style> body{ font-family: sans-serif; font-size: 20px; } .container-one div{ border: 1px dashed black; padding: 5px; margin:5px; } .container-one .row{ display: flex; } .container-one .row-title{ width:20%; min-width: 100px; } .container-one .row-content{ display: flex; justify-content: space-between; align-items: center; width: 80%; } .container-one svg.content-icon{ max-width: 150px; max-height: 10px; } .container-one svg{ width: 100%; height: 100%; border: 1px solid black; } </style> <body> <h1>CSS layouts</h1> <div class="container-one"> <div class="row"> <div class="row-title">...</div> <div class="row-content"> <div class="content-start">Start</div> <svg class="content-icon" width="30" height="10" viewBox="0 0 30 10"></svg> <div class="content-end">End</div></div> </div> <div class="row"> <div class="row-title">One</div> <div class="row-content"> <svg width="100" height="10" viewBox="0 0 100 10"></svg> </div> </div> <div class="row"> <div class="row-title">Two</div> <div class="row-content"> <svg width="100" height="10" viewBox="0 0 100 10"></svg> </div> </div> <div class="row"> <div class="row-title">Three</div> <div class="row-content"> <svg width="100" height="10" viewBox="0 0 100 10"></svg> </div> </div> <div class="row"> <div class="row-title">Four</div> <div class="row-content"> <svg width="100" height="10" viewBox="0 0 100 10"></svg> </div> </div> </div> </body> </html>