Block formatting

Block fromatting is quite limited in Scrapbox.io. Basically, you can note that there are the following forms:

code block, invoked as code:filename.extension

table, invoked as table:name_of_the_table

blockquote, invoked as > on the beginnin of a line (i.e. not expected [>)

Unfortunately, because of the internal workings of Scrapbox, it is not possible to easily modify, e.g., table based on its name or preceding tag.

However, there is a workaround (with limitations). It is possible to use familiar [ ] syntax from text formatting to format whole blocks.

💡 like this - this is a block

How can you achieve this? We will use what we learnt in Text formatting with custom CSS a map " in the way that it creates the yellow block.

code:style.css

.deco-\" {

/* Key part for making behave as a block */

display:inline-block;

width:100%;

/* background color and border */

background-color: #fff3cd;

border: 1px solid #ffeeba;

/* making some free space around it */

padding-left: 5px;

padding-right: 5px;

margin-bottom: 5px;

}

The magic is done by following two CSS declarations:

display:inline-block; – chages the display mode of an element to inline-block that allows to set the width and height

width:100%; – full width