we here at the WikiWichery may have something... first we must initiate the uninitiated, repeat the ecsoteric words...
Double, double toil and trouble; Fire burn and caldron bubble. Tag of code and toe of frog, Wikitext and tongue of prog, For a code of powerful trouble, Like a hell-broth boil and bubble. then inscribe the code into ye wiki... <style>.svgiconsbottom svg{width: 1.5em; height: 1.5em; margin: 0px; padding: 0px; vertical-align:bottom;} .svgiconsmiddle svg{width: 1.5em; height: 1.5em; margin: 0px; padding: 0px; vertical-align:middle;} .svgiconstop svg{width: 1.5em; height: 1.5em; margin: 0px; padding: 0px; vertical-align:top;} </style> A. icons left to right button vertical-align: none, vertical-align:bottom, middle, top<br/> B. svg (set by style section) vertical-align: none, vertical-align:bottom, middle, top<br/> A. <div style="border:dotted 2px; display:inline-block;"><$button style="margin0px; padding:0px; font-size:1.5em;">{{$:/core/images/full-screen-button}}</$button><$button style="margin:0px; padding:0px; font-size:1.5em; vertical-align:bottom;">{{$:/core/images/chevron-left}}</$button><$button style="margin:0px; padding:0px; font-size:1.5em; vertical-align:middle;">{{$:/core/images/full-screen-button}}</$button><$button style="margin:0px; padding:0px; font-size:1.5em; vertical-align:top;">{{$:/core/images/chevron-right}}</$button> </div> - - B. <div style="border:dotted 2px; display:inline-block;"><div style="margin:0px; padding:0px; display:inline-block;"><$button style="margin:0px; padding:0px; font-size:1.5em;">{{$:/core/images/full-screen-button}}</$button></div><div class="svgiconsbottom" style="display:inline-block;"><$button style="margin:0px; padding:0px; font-size:1.5em;">{{$:/core/images/chevron-left}}</$button></div><div class="svgiconsmiddle" style="margin:0px; padding:0px; display:inline-block;"><$button style="margin:0px; padding:0px; font-size:1.5em;">{{$:/core/images/full-screen-button}}</$button></div><div class="svgiconstop" style="margin:0px; padding:0px; display:inline-block;"><$button style="margin:0px; padding:0px; font-size:1.5em;">{{$:/core/images/chevron-right}}</$button></div></div> its a style section and 8 example icons to demo the positioning-- use the margin attribute in the style section to fine tune the svg's position you can also put the style section into a global stylesheet attached is a more detailed demo of svg & button vertical aligns -- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+unsubscr...@googlegroups.com. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/abec6409-8ccf-4b3d-99e3-56569baa1098%40googlegroups.com.
svg icon vertical align_position.tid
Description: Binary data