Today I found myself wanting to format some text in a simple HTML/CSS page as inline code, as is seen on Stack Exchange. After just a tiny bit of fiddling around, I got a very nice CSS style working:
.code {
background-color: rgb(230, 230, 230);
border-color: rgb(180, 180, 180);
border-radius: 3px;
border-width: 1px;
font-family: Consolas, "Lucida Console", "Courier New", monospace
padding: 2px;
}
Text formatted with that style (via <span class="code">) gets set apart from the rest of the page with a slightly distinct background color and a rounded border. The padding makes sure that the first and last characters aren't right up against the border.
No comments:
Post a Comment