2 posts in total

Css

Posts tagged

Dynamic Full Page Background Images in Rails

by Syed Aslam · 2 min read

Easy way to set a background from a selected number of images in Rails. You can set a background image purely through CSS thanks to the 'background-size' property in CSS3. Using the `html` element is better than `body` as it's always at least the height of the browser window. You set a fixed and centered background on it, then adjust it's size using `background-size` set to the cover keyword.

Centering a Fixed-Sized Element with CSS

by Syed Aslam · 1 min read

Here is one way to center a fixed-width/fixed-height div at the center of its container. This could be adapted to centering text, images, etc. within their containers. Essentially, we do a bit of arithmetic to get the fixed-sized element centered using absolute positioning and margins. Note that the parent container must have a `position: relative` property for this to work.