Case study: CSS position:absolute

Dec. 20, 2019

Introduction

It is the bug I created since I did not notice that the special case at work. Recently I added some margin in the website, and then if there is seven items, then last item will not displayed properly. I did not notice the issue until some one in the office told me so.

Case study

I quickly fixed the issue since I like the child div can have bigger width than parent div. So I learned from stackoverflow.com one question, the answer is to use CSS position:absolute.

My question to myself is to work on CSS by reading more often the tutorial. I should try to push myself to improve my CSS by actively reading the website.

The way I learn about CSS is not proactive. I should prepare myself to be expert one day in CSS.

Here is the website.

grid_10 class is defined the width of parent div - 820, total width 1008 for 12 grid, 82px for each grid.

Now the child div has more than 840 px.

Actionable items

I like to figure out how to master CSS, so I can have time to work on restful webservice, and framework for the front end.