CSS – flexbox and align-items property

CSS – flexbox and align-items property

align-items determines how the flex items will be aligned in the cross-axis. Cross-axis is the perpendicular axis to the main-axis. It is the direction might the flex items warp. align-items is applies to the flex container. The values it can have are flex-start, flex-end, center, baseline and stretch. THE END!!! CSS – flexbox and align-items property

CSS – flexbox and align-items property Read More

CSS – box-sizing property

CSS – box-sizing property

box-sizing property determines how the sizing properties are applied. It can take 2 values content-box and border-box content-box is the default value. Affects the content box of the element and padding and border are additional. The child divs have the half size, plus 10px the border. That is why the second child goes below. Div 150 px plus border 10 px both sides total 160 px border-box – the sizing properties are used to set the whole size of the element The divs have the half size 150 px, and…

CSS – box-sizing property Read More

CSS – position property

CSS – position property

Position determines the type of positioning method. It can take static, fixes, relative and absolute. There are 5 properties that specifies one element’s position: left, top, right and bottom. But by default they do not affect it because the default is position:static. static – it is the default value and elements are positioned according to the normal flow. Only margin, padding and display properties affect the position. It ignores left, top, right and bottom properties fixed – an element with fixed position will not scroll with the rest of the…

CSS – position property Read More

CSS position property

CSS position property

position property says to the browser the way an element should be positioned on the screen. It can take for values: relative | static | absolute | fixed relative an element is positioned relative to its normal position. You need to specify top,left,bottom or right. static This is the default value for all the elements and are positioned according to the normal flow. #divStatic{ position: static;} fixed Fixed location in the window and scroll does not affect it. In other words, it is relative to the viewport. You need to…

CSS position property Read More