From 19c65c4c3cb586836f0ddb6282ce9178bca29245 Mon Sep 17 00:00:00 2001 From: Xananax Date: Mon, 15 May 2017 20:22:57 +0300 Subject: [PATCH 1/4] first commit --- style/style.1.css | 224 ++++++++++++++++++++++++++++++++++++++++++++++ style/style.2.css | 196 ++++++++++++++++++++++++++++++++++++++++ 2 files changed, 420 insertions(+) create mode 100644 style/style.1.css create mode 100644 style/style.2.css diff --git a/style/style.1.css b/style/style.1.css new file mode 100644 index 0000000..f984532 --- /dev/null +++ b/style/style.1.css @@ -0,0 +1,224 @@ +@import "normalize.css"; + + +/** MAIN STUFF **/ + +body{ + font:16px Helvetica, Sans-Serif; + padding:50px 20px 20px 20px; +} + +header > div{ + max-width:960px; + margin:0 auto; + position: relative; +} + +hgroup{ + float:left; + margin:0; + border-bottom:1px solid #ccc; + width:100% +} + +header figure{ + position: absolute; + right:20px; +} + +header h2{ + display: none; +} + +header figure img{ + transform: rotate(-13deg); + width:200px; + height:200px; +} + +.content{ + padding:20px; + margin:0 auto; + max-width:960px; +} + +section{ + float:left; + padding-left:160px; + position:relative; + margin-bottom: 50px; +} + +h3{ + position: absolute; + top:0; + left:0; + width:150px; + margin-right:10px; + font-style: italic; + height:100%; + border-right:1px solid black; +} + +/** SKILLS STUFF **/ + +#competencies{ + +} + +.skills{ + padding-top:15px; +} + +.skill{ + width:130px; + margin:5px; + float:left; + padding:10px; + background:teal; + color:white; +} + +.skill span{ + width: 130px; + display:inline-block; +} + +.skill span::after{ + content:""; + color:white; + display:block; + float:right; +} + +.skill[data-skill="1"] span::after {content:"★";} +.skill[data-skill="1"] span::after {content:"★";} +.skill[data-skill="2"] span::after {content:"★★";} +.skill[data-skill="3"] span::after {content:"★★";} +.skill[data-skill="4"] span::after {content:"★★★";} +.skill[data-skill="5"] span::after {content:"★★★";} +.skill[data-skill="6"] span::after {content:"★★★★";} +.skill[data-skill="7"] span::after {content:"★★★★";} +.skill[data-skill="8"] span::after {content:"★★★★★";} +.skill[data-skill="9"] span::after {content:"★★★★★";} +.skill[data-skill="10"]span::after {content:"★★★★★";} + + +.skills-primary .skill{ + font-size: 1.2em; +} + +.skills-secondary .skill{ + font-size: .7em; +} + +/** ABOUT STUFF **/ + +#about{ + max-width:640px; + text-align: justify; + margin-bottom:100px; + font-style: italic; + color:#999; + padding-left:0; +} + +#about h3{ + display: none; +} + +/** EXPERIENCES STUFF **/ + +.experience h4{ + color:teal; + margin-bottom:3px; + float:left; +} + +.experience p{ + margin-top:30px; + float:left; +} + +.experience-details{ + color:#999; + float: right; + margin-top:18px; +} +.experience-type{ + font-weight:bold; +} +.experience-institution{ + display:none; +} + +.experience-date-separator{ + color:teal; +} + +/** CONTACTS STUFF **/ + +#contact h3{ + display: none; +} + +.contact{ + margin:0; + width:130px; + height:130px; + background-repeat: no-repeat; + background-size:80%; + background-position: 50% 50%; + float:left; + display: block; + margin:3px; +} + +.contact:hover{ + background-color:teal; +} + +.contact-type,.contact-value{ + display:block; + float:left; + margin:0; + width:100%; + height:100%; + text-align: center; +} + +.contact-type{ + display: none; +} + +.contact-value a{ + display:block; + width:100%; + height:100%; + font-size: 0; +} + +.contact-skype{ + display: none; +} + +.contact-phone{background-image:url("../images/phone.png");} +.contact-email{background-image:url("../images/email.png");} +.contact-github{background-image:url("../images/github.png");} +.contact-facebook{background-image:url("../images/facebook.png");} + +/** MEDIA QUERIES **/ + +@media only screen and (max-width: 650px) { + header figure{ + display: none; + } + section{ + padding-left:0; + } + h3{ + position: static; + border-right:none; + border-bottom:1px solid black; + } +} \ No newline at end of file diff --git a/style/style.2.css b/style/style.2.css new file mode 100644 index 0000000..70a260c --- /dev/null +++ b/style/style.2.css @@ -0,0 +1,196 @@ +@import "normalize.css"; + + +/** MAIN STUFF **/ + +body{ + font-family:'DroidSansBold', Arial, sans-serif; +} + +header{ + width:100%; + background:#999; + position: fixed; + top:0; + height:150px; + z-index: 2; + color:red; +} + +header > div{ + max-width:960px; + margin:0 auto; +} + +hgroup{ + float:left; + margin:0 30px; +} + + +.content{ + padding:200px 20px 20px 20px; + margin:0 auto; + max-width:960px; +} + +h3{ + border-bottom:1px solid #ccc; + padding-bottom:10px; + margin-bottom:10px; +} + +h3::before{ + content:""; + display:inline-block; + width:20px; + height:20px; + background:red; + margin-right:5px; + border-radius: 50%; +} + +section{ + width:50%; + float:left; + box-sizing: border-box; +} + + +/** SKILLS STUFF **/ + +.skill{ + background:#ccc; + margin:3px; + padding:5px; +} + +.skill span{ + width:0; + background:red; + display:block; + padding:5px; + color:white; + line-height: 1; +} + +.skill[data-skill="1"] span{width:10%;} +.skill[data-skill="2"] span{width:20%;} +.skill[data-skill="3"] span{width:30%;} +.skill[data-skill="4"] span{width:40%;} +.skill[data-skill="5"] span{width:50%;} +.skill[data-skill="6"] span{width:60%;} +.skill[data-skill="7"] span{width:70%;} +.skill[data-skill="8"] span{width:80%;} +.skill[data-skill="9"] span{width:90%;} +.skill[data-skill="10"] span{width:100%;} + +.skills-primary::before, .skills-secondary::before{ + margin-top:10px; + display: inline-block; +} + +.skills-primary::before{ + content:"Main" +} + +.skills-secondary::before{ + content:"Other" +} + +.skills-secondary .skill{ + opacity: .7 +} + +/** EXPERIENCES STUFF **/ + +.experience h4{ + color:red; + margin-bottom:3px; +} +.experience-details{ + color:#999; + margin-left:10px; +} +.experience-type{ + font-weight:bold; +} +.experience-institution{ + font-weight: normal; +} +.experience-institution::before{ + content:"@ "; +} +.experience-location::before{ + content:"In" +} +.experience-date::before{ + content:" on " +} +.experience-date-separator{ + color:red; +} + +/** CONTACTS STUFF **/ + +#contact{ + position:fixed; + top:10px; + right:10px; + z-index: 3; + background: black; +} + +#contact h3{ + display: none; +} + +.contact{ + margin:0; +} + +.contact-type,.contact-value{ + display:inline-block; + margin:0; + padding:3px; +} + +.contact-type{ + width:120px; + background:red; + color:white; +} + +.contact-value a{ + text-decoration: none; + color:red; +} + +/** MEDIA QUERIES **/ + +@media only screen and (max-width: 960px) { + section{ + width:100%; + } +} + +@media only screen and (max-width: 450px) { + header{ + height:300px; + } + hgroup{ + width:100%; + } + .content{ + padding-top:350px; + } + #contact{ + position:static; + top:auto; + right:auto; + background:transparent; + } + #contact h3{ + display:block; + } +} \ No newline at end of file From ec94c1c81dd1df443fb602b329256a6811a7114e Mon Sep 17 00:00:00 2001 From: Aliosseily Date: Mon, 11 Dec 2017 11:07:31 +0200 Subject: [PATCH 2/4] style.css --- index.html | 17 ++--- style/style.css | 176 +++++++++++++++++++++++++++++++++++++++++++++++ style/style2.css | 149 +++++++++++++++++++++++++++++++++++++++ 3 files changed, 334 insertions(+), 8 deletions(-) create mode 100644 style/style.css create mode 100644 style/style2.css diff --git a/index.html b/index.html index f4587c8..cfa4452 100644 --- a/index.html +++ b/index.html @@ -15,7 +15,7 @@ -
+
@@ -31,22 +31,24 @@

Codes and Sleeps

About

- Pellentesque nec nisi at sapien sagittis sagittis. Aliquam eu condimentum mauris. Proin accumsan enim at risus hendrerit lobortis. Nunc sollicitudin sodales lectus, et rhoncus mi molestie hendrerit. Vestibulum velit lorem, rhoncus a congue ultricies, faucibus facilisis risus. Mauris turpis ante, aliquet ac venenatis at, ornare ut velit. Duis ut erat neque, eget consectetur tellus. + Pellentesque nec nisi at sapien sagittis sagittis. Aliquam eu condimentum mauris. Proin accumsan enim at risus hendrerit lobortis. Nunc sollicitudin sodales lectus, et rhoncus mi molestie hendrerit. Vestibulum velit lorem, rhoncus a congue ultricies, faucibus facilisis risus. Mauris turpis ante, aliquet ac venenatis at, ornare ut velit. Duis ut erat neque, eget consectetur tellus.

Competencies

+
- HTML + HTML
CSS
-
+
Javascript
+
HTML @@ -54,7 +56,7 @@

Competencies

CSS
-
+
Javascript
@@ -151,14 +153,13 @@

Hobbies

-
    +
    • Watching Youtube
    • Sleeping
    • Writing CVs
-

Contact

Email
@@ -166,7 +167,7 @@

Contact

jad@codi.tech
-
+
Skype
jad.sarout
diff --git a/style/style.css b/style/style.css new file mode 100644 index 0000000..c3ecf60 --- /dev/null +++ b/style/style.css @@ -0,0 +1,176 @@ +body{ + width: 1200px; + + +} + +.content{ margin :67px; +overflow:hidden;} +header{background:grey; +} + +#wrapper{ width: 80%; + margin: auto ;} + +figure{ + position: absolute; + left: 400px; + top: 10px; } + +hgroup{padding: 10px 70px; + color:red;} + + +section{ + float:left; + width:49%; + +} + +h4{color:red;} + +body{ + font-family: sans-serif; + } + +h3{ + border-bottom: 1px solid rgba(153, 153, 153, 0.61); + } +h3:before{ + content: ""; + width: 15px; + height: 15px; + float: left; + margin: 0 6px 0 0; + border-radius: 7.5px; + background-color:red +} + + + +.experience-date-separator{color:red;} + + + + +.skill{ +text-align: left; +padding-right: 30px; +height: 30px; +color:white; +width: 92%; background-color:grey; + margin :2px; + +} + [data-skill="5"] span{ + display: block; + background-color: red; + height: 30px; + width: 62%; + +} +[data-skill="3"] span{ + display: block; + background-color: red; + height: 30px; + width: 50%; +} +[data-skill="1"] span{ + display: block; + background-color:red; + height: 30px; + width: 30%;} + + [data-skill="9"] span{ + display: block; + background-color: red; + height: 30px; + width: 95%;} + + [data-skill="7"] span{ + display: block; + background-color: red; + height: 30px; + width: 80%;} + .skills.skills-primary::before{ + content:"Main"; + } + .skills.skills-secondary::before{ + content:"Others"; + } + .skills.skills-secondary span { + box-shadow: inset 0px 35px 0px 0px #a59c9c62 + } + .contacts{ + + position: absolute; + top: 35px; + right: px; + width: 358px; + color: orangered + + + } + dl { + width: 150%; + + padding: 0; + margin: 0; + } + dt { + float: left; + width: 21%; + background:orangered; + color:white; + + } + dd { + float: left; + width: 70%; + background:black; + padding: 0; + margin: 0; + color:orangered; + } + a:link{text-decoration: none; + color: orangered; + + } + @media screen and (max-width:1018px) { + .contacts { + position: absolute; + left:200px; + top:2000px; + }} @media screen and (max-width:704px) { + figure { + position: relative; + left: 70px; + top: -15px; }} + @media screen and (max-width:1018px) { + #competencies{ + position:absolute; + top:540px; + left:200px; + width:390px; + + } + } + + @media screen and (max-width:1018px) { + #experiences{ position:absolute; + top:830px; + left:200px; + width:390px;}} + + @media screen and (max-width:1018px) { + #education{ position:absolute; + top:1350px; + left:200px; + width:390px;}} + + @media screen and (max-width:1018px) { + #hobbies{ position:absolute; + top:1870px; + left:200px; + width:390px;}} + \ No newline at end of file diff --git a/style/style2.css b/style/style2.css new file mode 100644 index 0000000..54ed8c4 --- /dev/null +++ b/style/style2.css @@ -0,0 +1,149 @@ + +body{ width: 800px; + margin: auto; + font-size: 16px ; + border: 1px solid black; + + +} + + +h1{ + font-size: 35px; + border-bottom: 1px solid rgba(153, 153, 153, 0.61); +} + + h2{display: none;} + #about h3{display :none;} + figure{ + position: relative; + float: right; + top:-70px; + left:-20px; + transform: rotate(-10deg); + } + img { + width:150px; + height:150px ;} + + #about { width: 600px;} + + + + + + h3{ font-style: italic; + font-weight: bold; + border-right: 2px solid rgba(17, 17, 17, 0.685); + float: left; + height: 300px; + width:115px; } + + + + .skill{margin: 2.5%;color:white} + + #competencies{ + width: 794px; + overflow: hidden; + height: 100px;} + + #experiences{ + width: 794px; + overflow: hidden;} + + .experience{padding:5px; + } + #education{ + width: 794px; + overflow: hidden;} + + #hobbies{ + width: 794px; + overflow: hidden; + + height: 100px; } + + .experience-location{ + float: right; + margin: -40px 130px 9px 0; + position: relative; + } + .experience-date{ + float: right; + margin: -40px 35px 9px 0; + position: relative; + } + + + [data-skill="5"] span{ + display: inline-block; + background-color: rgb(47, 0, 255); + height: 20px; + width: 15%; + padding:3px; + } + + + + [data-skill="3"] span{ + display: inline-block; + background-color:rgb(47, 0, 255); + height: 20px; + width: 10%; + padding:3px; + position: absolute; + left:400px; + top:295px; + } + + [data-skill="1"] span{ + display: inline-block; + background-color: rgb(47, 0, 255); + height: 20px; + width: 10%; + padding:3px; + position: absolute; + left:525px; + top:295px; + +} + +[data-skill="9"] span{ + display: inline-block; + background-color: rgb(47, 0, 255); + height: 20px; + width: 10%; + padding:3px; + position: absolute; + left:400px; + top:341px; + + +} +[data-skill="7"] span{ + display: inline-block; + background-color: rgb(47, 0, 255); + height: 20px; + width: 10%; + padding:3px; + position: absolute; + left:525px; + top:341px; + +} +#contact{ + background:url(/home/ali/css-cv/images/facebook.png) no-repeat,fixed; + + + height:100px; + border: 1px solid green; + } + + + +.contact-type, .contact-value{display:none} + + + + From 9d1fe930e50099ffa3c7ae80908b4b0653e0d03d Mon Sep 17 00:00:00 2001 From: Aliosseily Date: Tue, 19 Dec 2017 17:10:08 +0200 Subject: [PATCH 3/4] styles.css --- index.html | 2 +- style/style2.css | 259 ++++++++++++++++++++++-------------------- style2.css/style2.css | 158 ++++++++++++++++++++++++++ 3 files changed, 293 insertions(+), 126 deletions(-) create mode 100644 style2.css/style2.css diff --git a/index.html b/index.html index cfa4452..8c656d8 100644 --- a/index.html +++ b/index.html @@ -11,7 +11,7 @@ Jad Sarout | CV - + diff --git a/style/style2.css b/style/style2.css index 54ed8c4..5eb223c 100644 --- a/style/style2.css +++ b/style/style2.css @@ -1,21 +1,18 @@ -body{ width: 800px; +body{ width: 900px; margin: auto; font-size: 16px ; - border: 1px solid black; -} - - -h1{ + } + h1{ font-size: 35px; - border-bottom: 1px solid rgba(153, 153, 153, 0.61); + border-bottom: 1px solid rgb(153, 153, 153); } - - h2{display: none;} - #about h3{display :none;} - figure{ +h2{display: none;} +#about h3{display :none;} +#about p{color:grey;} +figure{ position: relative; float: right; top:-70px; @@ -25,125 +22,137 @@ h1{ img { width:150px; height:150px ;} - - #about { width: 600px;} - - - - - - h3{ font-style: italic; - font-weight: bold; - border-right: 2px solid rgba(17, 17, 17, 0.685); - float: left; - height: 300px; - width:115px; } - - - - .skill{margin: 2.5%;color:white} - - #competencies{ - width: 794px; - overflow: hidden; - height: 100px;} - - #experiences{ - width: 794px; - overflow: hidden;} - - .experience{padding:5px; - } - #education{ - width: 794px; - overflow: hidden;} - #hobbies{ - width: 794px; - overflow: hidden; - - height: 100px; } - - .experience-location{ - float: right; - margin: -40px 130px 9px 0; + #competencies h3{ + + display: inline-block; + padding-right: 9px; + border-right: 1px solid black; + height:90px; position: relative; - } - .experience-date{ - float: right; - margin: -40px 35px 9px 0; - position: relative; + bottom:-60px; + } + #competencies .skill{ + display: inline-block; + margin:3px; + background-color: rgba(1, 106, 129, 0.925); + color:white; + height: 20px; + padding: 5px; + position: relative; + bottom:50px; + left: 130px; + width:110px + } + .skills-primary + [data-skill="5"] span::after{content:"***";position: relative; bottom:-4px; float:right; } - - - [data-skill="5"] span{ - display: inline-block; - background-color: rgb(47, 0, 255); - height: 20px; - width: 15%; - padding:3px; + [data-skill="3"] span::after{content:"**";position: relative; bottom:-4px; float:right; } - - - - [data-skill="3"] span{ - display: inline-block; - background-color:rgb(47, 0, 255); - height: 20px; - width: 10%; - padding:3px; - position: absolute; - left:400px; - top:295px; - } - - [data-skill="1"] span{ - display: inline-block; - background-color: rgb(47, 0, 255); - height: 20px; - width: 10%; - padding:3px; - position: absolute; - left:525px; - top:295px; - -} - -[data-skill="9"] span{ - display: inline-block; - background-color: rgb(47, 0, 255); - height: 20px; - width: 10%; - padding:3px; - position: absolute; - left:400px; - top:341px; - - -} -[data-skill="7"] span{ - display: inline-block; - background-color: rgb(47, 0, 255); - height: 20px; - width: 10%; - padding:3px; - position: absolute; - left:525px; - top:341px; + [data-skill="1"] span::after{content:"*";position: relative; bottom:-4px; float:right; + } + .skills-secondary{font-size:small;} + [data-skill="9"] span::after{content:"******";position: relative; bottom:-4px; float:right; + } + [data-skill="5"] span::after{content:"***";position: relative; bottom:-4px; float:right; + } + [data-skill="7"] span::after{content:"****";position: relative; bottom:-4px; float:right; + } + #experiences h3{ -} -#contact{ - background:url(/home/ali/css-cv/images/facebook.png) no-repeat,fixed; - - - height:100px; - border: 1px solid green; - } - + display: inline-block; + padding-right: 24px; + border-right: 1px solid black; + height:270px; + } + #experiences .experience{ + position: relative; + bottom:307px; + left: 130px; + width: 800px; + } + .experience-location{ + float: right; + margin: -40px 125px 9px 0; + position: relative; + color:grey; + + } + .experience-date{ + float: right; + margin: -40px 29px 9px 0; + position: relative; + color:grey; + } + #education h3{ + + display: inline-block; + padding-right: 38px; + border-right: 1px solid black; + height:270px; + position: relative; + bottom:275px; + + } + #education .experience{ + position: relative; + bottom:580px; + left: 130px; + width: 800px;} + + #hobbies h3{display: inline-block; + padding-right: 55px; + border-right: 1px solid black; + height:80px; + position: relative; + bottom:550px;} + + #hobbies ul{position: relative; + bottom:670px; + left: 125px; + width: 800px;} -.contact-type, .contact-value{display:none} - - - + + h4{color:rgba(1, 106, 129, 0.925);} + + + .contact-type,.contact-value{display:none} + .contact-email{height: 100px;width:100px; + background-image: url(/home/ali/css-cv/images/email.png) ; + background-size: 100px 100px; + position: relative; + bottom:590px; + left: 160px; + } + .contact-skype{ + height: 100px;width:100px; + background-image: url(/home/ali/css-cv/images/phone.png) ; + background-size: 100px 100px; + position: relative; + bottom:705px; + left: 300px; + } + + .contact-phone{ + height: 100px;width:100px; + background-image: url(/home/ali/css-cv/images/github.png); + background-size: 100px 100px; + position: relative; + bottom:820px; + left:440px; + + } + + .contact-github + { + height: 100px;width:100px; + background: url(/home/ali/css-cv/images/facebook.png) right bottom no-repeat; + background-size: 100px 100px; + position: relative; + bottom:935px; + left:600px; + + } + \ No newline at end of file diff --git a/style2.css/style2.css b/style2.css/style2.css new file mode 100644 index 0000000..5eb223c --- /dev/null +++ b/style2.css/style2.css @@ -0,0 +1,158 @@ + +body{ width: 900px; + margin: auto; + font-size: 16px ; + + + } + h1{ + font-size: 35px; + border-bottom: 1px solid rgb(153, 153, 153); +} +h2{display: none;} +#about h3{display :none;} +#about p{color:grey;} +figure{ + position: relative; + float: right; + top:-70px; + left:-20px; + transform: rotate(-10deg); + } + img { + width:150px; + height:150px ;} + + #competencies h3{ + + display: inline-block; + padding-right: 9px; + border-right: 1px solid black; + height:90px; + position: relative; + bottom:-60px; + } + #competencies .skill{ + display: inline-block; + margin:3px; + background-color: rgba(1, 106, 129, 0.925); + color:white; + height: 20px; + padding: 5px; + position: relative; + bottom:50px; + left: 130px; + width:110px + } + .skills-primary + [data-skill="5"] span::after{content:"***";position: relative; bottom:-4px; float:right; + } + [data-skill="3"] span::after{content:"**";position: relative; bottom:-4px; float:right; + } + [data-skill="1"] span::after{content:"*";position: relative; bottom:-4px; float:right; + } + .skills-secondary{font-size:small;} + [data-skill="9"] span::after{content:"******";position: relative; bottom:-4px; float:right; + } + [data-skill="5"] span::after{content:"***";position: relative; bottom:-4px; float:right; + } + [data-skill="7"] span::after{content:"****";position: relative; bottom:-4px; float:right; + } + #experiences h3{ + + display: inline-block; + padding-right: 24px; + border-right: 1px solid black; + height:270px; + } + + #experiences .experience{ + position: relative; + bottom:307px; + left: 130px; + width: 800px; + } + .experience-location{ + float: right; + margin: -40px 125px 9px 0; + position: relative; + color:grey; + + } + .experience-date{ + float: right; + margin: -40px 29px 9px 0; + position: relative; + color:grey; + } + #education h3{ + + display: inline-block; + padding-right: 38px; + border-right: 1px solid black; + height:270px; + position: relative; + bottom:275px; + + } + #education .experience{ + position: relative; + bottom:580px; + left: 130px; + width: 800px;} + + #hobbies h3{display: inline-block; + padding-right: 55px; + border-right: 1px solid black; + height:80px; + position: relative; + bottom:550px;} + + #hobbies ul{position: relative; + bottom:670px; + left: 125px; + width: 800px;} + + + + h4{color:rgba(1, 106, 129, 0.925);} + + + .contact-type,.contact-value{display:none} + .contact-email{height: 100px;width:100px; + background-image: url(/home/ali/css-cv/images/email.png) ; + background-size: 100px 100px; + position: relative; + bottom:590px; + left: 160px; + } + .contact-skype{ + height: 100px;width:100px; + background-image: url(/home/ali/css-cv/images/phone.png) ; + background-size: 100px 100px; + position: relative; + bottom:705px; + left: 300px; + } + + .contact-phone{ + height: 100px;width:100px; + background-image: url(/home/ali/css-cv/images/github.png); + background-size: 100px 100px; + position: relative; + bottom:820px; + left:440px; + + } + + .contact-github + { + height: 100px;width:100px; + background: url(/home/ali/css-cv/images/facebook.png) right bottom no-repeat; + background-size: 100px 100px; + position: relative; + bottom:935px; + left:600px; + + } + \ No newline at end of file From 536003a7693ccb76bd7c16b3d1d9f1cbd4f4cc94 Mon Sep 17 00:00:00 2001 From: Aliosseily Date: Wed, 20 Dec 2017 10:27:42 +0200 Subject: [PATCH 4/4] solution aliosseily --- index.html | 2 +- style/style.css | 16 ++++++++-------- style/style2.css | 2 +- 3 files changed, 10 insertions(+), 10 deletions(-) diff --git a/index.html b/index.html index 8c656d8..cfa4452 100644 --- a/index.html +++ b/index.html @@ -11,7 +11,7 @@ Jad Sarout | CV - + diff --git a/style/style.css b/style/style.css index c3ecf60..49ea4cd 100644 --- a/style/style.css +++ b/style/style.css @@ -1,6 +1,7 @@ + body{ width: 1200px; - + padding:40px; } @@ -14,8 +15,8 @@ header{background:grey; figure{ position: absolute; - left: 400px; - top: 10px; } + left: 450px; + top: 50px; } hgroup{padding: 10px 70px; color:red;} @@ -104,9 +105,9 @@ width: 92%; background-color:grey; .contacts{ position: absolute; - top: 35px; - right: px; - width: 358px; + top: 80px; + right: 348px; + width: 340px; color: orangered @@ -172,5 +173,4 @@ width: 92%; background-color:grey; #hobbies{ position:absolute; top:1870px; left:200px; - width:390px;}} - \ No newline at end of file + width:390px;}} \ No newline at end of file diff --git a/style/style2.css b/style/style2.css index 5eb223c..b8a574f 100644 --- a/style/style2.css +++ b/style/style2.css @@ -68,7 +68,7 @@ figure{ #experiences .experience{ position: relative; - bottom:307px; + bottom:305px; left: 130px; width: 800px; }