[nospaces] [div style="font-size: 0; line-height: 0]
[googlefont=Overpass Mono:400,600,700]

[newclass=.meta]max-width: 400px; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .15); border: 1px solid #fff; color: #333; background: #fff; text-align: left; font: 12px/1.25em Arial, sans-serif; display: grid; grid-template-rows: repeat(3, auto); grid-row-gap: 0;[/newclass]

[newclass=.meta>div]padding: 15px [/newclass]

[newclass=.meta>div:nth-child(2)] padding-top: 0[/newclass]

[newclass=.meta h3] font: 700 16px/1.25em 'Overpass Mono'; margin: 0; [/newclass]

[newclass=.meta h5] margin: 0 0 2px; font: 400 10px 'Overpass Mono',sans-serif; text-transform: uppercase; letter-spacing: 1px[/newclass]

[newclass=.meta a] font: inherit; text-decoration: none; color: #4855da[/newclass]

[newclass=.meta .codesnippet] display: inline; font-weight: 600; font-family: 'Overpass Mono',monospace; color: #4855da; border-bottom: 0px dashed #999; [/newclass]

[newclass=.meta ul] margin: 0 0 15px; margin-left: 10px; padding: 0; [/newclass]

[newclass=.meta li] margin-bottom: 10px !important; list-style-type: none; text-indent: -10px [/newclass]

[newclass=.meta li:before] content: '▪'; margin-right: 5px; font-size: 14px; line-height: 0; [/newclass]

[newclass=.meta br+br]content: ' '; display: block; margin: 0 0 7px;[/newclass]

[newclass=.meta a.hashtag] background: #f3f3f3; padding: 5px 5px; color: #333; font: bold 11px/10px sans-serif; margin: 3px 2px 3px 0; display: inline-block; letter-spacing: .2px; text-decoration: none; [/newclass]

[newclass=.meta-imgbox] margin: 30px 0 [/newclass]

[newclass=.codebox] border-top: 1px solid rgba(0, 0, 0, .15); text-align: center; margin-bottom: 2px;[/newclass]

[newclass=.codebox textarea,.codebox code] width: 80%; height: 100px; overflow: auto; text-align: left; margin: auto; padding: 10px 5px; background: rgba(0, 0, 0, .05); border: 1px solid rgba(0, 0, 0, .15); [/newclass]

[newclass=.codebox .code_tag_toggle, .meta .button] background: #000; width: 150px; color: #fff; font: bold 12px sans-serif; padding: 8px 15px; margin: 10px 0 0; border-radius: 3px; text-align: center; outline: none; letter-spacing: .5px; border: none; [/newclass]

[newclass=.codebox .code_tag_toggle:active, .meta .button:active] background: #333; [/newclass] [/div]


[div align="center"][div][attr="class","meta"]

[div]
[h5]Type[/h5]
[h3]Name[/h3]
[/div]

[div]
[ul]
[li]Two versions: one can fit a square image icon, or a honeybee icon.[/li]
[li]Features css accents. Accent color is controlled via [div][attr="class","codesnippet"]--accentcolor: #XXXXXX[/div] and [div][attr="class","codesnippet"]--accentRGBcolor: X,X,X[/div]
[/li]
[li]Bold styling applies color automatically[/li]
[li]Please leave the credits in place, and let me know if you use it![/li]
[/ul]

[#]gimmickmade
[/div]


[div][attr="class","codebox"]
[CODE*] CODECODECODE[*/CODE]
[a href="#"]
[div style="background:#000;width:200px;color:#fff;font:bold 12px sans-serif;padding:8px 0 10px;border-radius:3px;text-align: center;letter-spacing: .7px; margin: auto"]Live Preview & Code[/div][/a][/div]



[/div][/div]

Code element style is being applied to text inline?


one line

see with a line break