Here lies all interesting stuff I find about CSS. These would include all bugs, errors, fixes, and other technical information that I could find useful in my development journey.
We can use the following to display an inline block in CSS:
selector-here {
display: inline-block;
}
An inline block fixes the problem of working with block-level elements and text-align whereby the block-level element acts in a way that fills up the entirety of the block-level element. Refer to this for more context.
Refer to this for preliminary context. Here’s how it works:
CSS adds visited, hover, and active properties to a selector as follows. Say, for example, we have a selector for a <p> with the following attribute: class="for-css", and we wanted to change its look for when it’s on hover, active, and visited.
It will look like this, when we modify it in the styles.css sheet of my project:
If there are two values in a margin property, they set the margin values of top & bottom, left & right. Here’s a code snippet to understand it more. Say we have an HTML p element with the attribute class="something", and we wanted to add a 10px auto value in its margin:
It would look something like this in the HTML file:
<p class="something">style me, please!</p>
In the CSS stylesheet, it would look like this:
p.something {
margin: 10px auto;
}
If there were two values and, say, we wanted to create a CSS attribute that sets the margin-top & margin-bottom to 20px, and marign-left and margin-right to 10px. It would look like this:
We can select the last element of a specific type using the CSS pseudo-class last-of-type. This pseudo-class is to be appended into an existing CSS selector, like so:
p:last-of-type, where p is the element type from which we are selecting. After selecting, we can move forward to specifying CSS attributes for the entire selector.
The difference of a block element and an inline-block:
Block: A block element takes up the full width available, and has a line break before and after it. Inline: An inline element does not have line break before and after it, and only takes up as much width as necessary.
