Css code operator meaning


#1

Hey guys, I have trouble understanding what does these code mean in the ionic.css file.

.item-button-right > .button .icon:before, .item-button-right .item-content > .button .icon:before, .item-button-right > .buttons .icon:before, .item-button-right .item-content > .buttons .icon:before {
position: relative;
left: auto;
width: auto;
line-height: 31px; }

.item-button-right > .button > .button, .item-button-right .item-content > .button > .button, .item-button-right > .buttons > .button, .item-button-right .item-content > .buttons > .button {
margin: 0px 2px;
min-width: 34px;
min-height: 34px;
font-size: 18px;
line-height: 32px; }

What does the period, great than sign, comma, colon all mean??


#2

Sry, but maybe you have to take a look in a css tutorial?

‘>’ means “a direct child of the parent selector”
’:’ before, after: you can add additional content in front or after the selected element … mostly used to use icon fonts and positionate them … see the ‘content’ attribute, there are other predefined statements like :hover, :active and so on
’,’ separates css selectors… example:
input, textarea {
background-color: #000;
}
This means -> the background for inputs and textareas are black

Greets bengtler


#3

Thank you bengtler for taking the time writing these stuff. Will do!