Mondrian-Project

Table of contents

Overview

• [Overview](The Project About Mondrian-Project)
  • Screenshot
  • Links
• My process
  • [Built with](Html Css-Grid)
  • [What I learned](How to manage page with Grid-Box with simple code and how to make all the project look simple with learn all about positions )
  • [Continued development](Now im try to learn Bootstrap)
  • Useful resources
• [Author => Pepo]

Screenshot

Built with

• Semantic HTML5 markup
• CSS custom properties
• Grid layout

What I learned

First Html i just know from now how to make in icons for my Web site

<h1>Some CSS code I'm proud of</h1>
<style>
   .container {
      height: 748px;
      width: 748px;
      display: grid;
      background-color: #000;
      grid-template-columns: 320px 198px 153px 50px;
      grid-template-rows: 414px 130px 155px 22px;
      gap: 9px;
    }
    .white1 {
      grid-column: span 3;
    }

    .white2 {
      grid-row: span 2;
    }

    .white3 {
      grid-area: 2 / 2 / 4 /4
    }
   </style> 

const proudOfThisFunc = () => {
  console.log('Yayyyyyy🎉')
}

Continued development

My future PLans is to be more good in css{Bootstrap}

Useful resources

• Example resource - This helped me for Position and Flex with how to manage Div reason. I really liked this pattern and will use it going forward.

Author

• LinkDen - Pepo
• Frontend Mentor - @Pepo946
• Twitter - @Pepo9461