Hi, 

In unit 3 CSS Styling,

I was able to learn how to style my documents (html) using CSS.

I had a hard time at first as I made the html with <br> everywhere and other elements to style the pages using only html. I also had to reorganize the html code to prepare it for the CSS styling. I wanted to make sure I do all the style only with CSS.

I had to remove previous tags and create other <div> to better manage my pages content by class. I gave class names for each content box that are targeted in CSS using the dot with the class name. In CSS, I learned about coloring the texts, background colors, controlling my content with divs by using CSS to align my div boxes and float to put them side by side.

Also, I added a clear-both in my CSS for the home page, so the footer doesn’t come in the background of my recent reviews and news box. I learned that in order to create a scroll bar I had to use the overflow: auto. It takes the content of my text and keeps it inside the box and adds a scroll bar instead. I used it also inside my reviews page as there will be new reviews added in the future.

The navigation bar uses a: hover to change the colors when the mouse hovers it. I also learned about the box-sizing effect that fix a problem I had with layout in the home page news and recent reviews box. I learned about position but did not use it as the website uses the flow of the document and simple enough.

I also learned about the css syntax and level of ordering like when you want to call a <p> inside a class targeted element you can do it by doing “.classname p” (without the “ “).

If I had to redo this I would maybe re edit my header so the navigation bar follows. I followed the site design and matched the site to the personas in my initial design as well.

This was very refreshing to see all the new elements and syntax that you can use to style a webpage. It certainly creates a much more entertaining website than just html.

I used my book HTML and CSS by JOHN DUCKET and a small crash course from traversy media before I started. ( https:// www.youtube.com /watch?v=yfoY53QXEnI )

As I also navigated and learn through the w3schools tutorials and advanced tabs on the left. They gave me what I need in order to create a style that reflect my site design.

Jasmin Gallant