Carpool

Hej Namn!

OutPut

car website header

Carpool

Hej Namn!

Bokningar

Här hittar du alla dina bokningar

Ändra/Avboka resa?

Mitt Konto

Här hittar du dina inställningar och favoriter

Kundservice

Kontakta oss här.

Här kan du även anmäla skador.

Explination

I suggest you review the HTML and CSS lessons.

Images

1. Resize the Image with the width and height attributes

Validation

2. Improper use of tags will display sometimes but they will not be valid and will cause things to break.

Element “h4” is not allowed as child of element “button” in this context.

Also Remove

the aside tags, div tags and all of your inline styles, class and Id attributes.

2a. Remove the body tag on line 44 add

place the closing tag at the end of the document like so.
</body></html>

2b. Make sure there aren't any stray tags

Buttons

3. Button size scales to the text inside:

However you may edit the width of the button with the inline style attribute:

Better Button style

4. Styling is better with CSS.

In the HTML Tab

Create a button with the class name button.

.button {
property Name: Property Values;
}

I've added some styles to your CSS tab

You may change the property values how you like.

6. add button class to your buttons.

In your login button tag add a class with the name button1.

In your profil button tag add a class with the name button2.

float property

7. There are many ways to align items.
For this example you may use the The float property

I've put the proper CSS in the CSS Tab

Divs

8. There is an issue with the way you have made your last 3 buttons.

replace the last 3 buttons tags with div tags.

We will style the divs wish CSS to make them look like buttons.

Flex

9.

Here we will use the CSS display Porperty and value flex to get the rest of the bottons to line up.

Check the CSS tab

Edit for Maria Milner