Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

Sometimes You've Just Gotta Draw a Line

DZone's Guide to

Sometimes You've Just Gotta Draw a Line

· Web Dev Zone
Free Resource

Get deep insight into Node.js applications with real-time metrics, CPU profiling, and heap snapshots with N|Solid from NodeSource. Learn more.

 I needed a short line in my HTML UI.  Turns out, you can do it with CSS. Here's the code that draws the specific line I needed:

<div
  style="height: 14px;
  color:white; background:white;
  position:absolute; left:77px; top:8px;
  transform:rotate(27deg);
  -ms-transform:rotate(27deg); /* IE 9 */
  -webkit-transform:rotate(27deg); /* Safari and Chrome */
  width:1px"/>
And here's a general-purpose kit for drawing lines a lot, which provided the clues I needed:

http://monkeyandcrow.com/blog/drawing_lines_with_css3/

So now you know.


Node.js application metrics sent directly to any statsd-compliant system. Get N|Solid

Topics:

Published at DZone with permission of Jerry Andrews, DZone MVB. See the original article here.

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}