This is css test page. At the moment I am experimenting with floating images and a sub footer menu. I must admit that I still don't understand the class inheritance rules. The sub menu is of class menu - it looks like the .center inherits the .menu charateristics. Except that I don't seem to define .menu class on its own only wrt ul and li in rwd.css.
Sub Footer Menu
This is to add more menu options at the bottom of the page.
The css for floating images
An exercise in wrapping text around images. Some more css here locally. If it works can be incorporated in main css file for website.
The code for the above uses 2 divs of class="clearfix"
The text here seems to stay in the container but falls out if a use a paragraph tag????
There doesn't seem to be a margin or padding between the image and the text.
Adding a margin to the img just shrinks the image???
What I really want is image to scale in screen resolution.
Links
- Image Handling - scaling images on reponsive pages
- Responsive Image Grid
- Clearfix - clear child elements automatically without any additional markup
- Responsive Web Design
- Sub Footer Menu
- CSS
- DOM
External Sources
- CSS - The ::after Pseudo-element 🔗 W3C Schools