lukas/PersonalWebsite
1
0
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects Releases Wiki Activity

right float of about picture responsive

Browse Source
This commit is contained in:
Lukas Heiligenbrunner
2020-03-17 22:50:13 +01:00
parent f1602b8e93
commit 8bd8985995
2 changed files with 19 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
css/index.css
View File

@@ -49,12 +49,19 @@ body, html {
float: left; float: left;
} }
.aboutPic { .aboutPicContainer {
width: 60%; width: 60%;
height: 300px; height: 300px;
float: left; float: left;
} }
#aboutPic {
float: right;
margin-top: 10%;
box-shadow: rgba(2, 12, 27, 0.7) 0px 10px 30px -15px;
height: 100%;
}
/* screen larger than 600px -- desktop */ /* screen larger than 600px -- desktop */
@media screen and (min-width: 1201px) { @media screen and (min-width: 1201px) {
.tile { .tile {
@@ -129,7 +136,7 @@ body, html {
width: 100%; width: 100%;
} }
.aboutPic { .aboutPicContainer {
width: 100%; width: 100%;
height: 150px; height: 150px;
} }
@@ -137,4 +144,11 @@ body, html {
#section2 { #section2 {
height: 130%; height: 130%;
} }
#aboutPic {
float: initial;
margin-left: auto;
margin-right: auto;
/* todo nof loating right in middle */
}
} }

4
index.html
View File

@@ -94,8 +94,8 @@
<li>OpenSCAD</li> <li>OpenSCAD</li>
</ul> </ul>
</div> </div>
<div class="aboutPic"> <div class="aboutPicContainer">
<img src="rsc/self4.jpg" height="100%" style="float:right; margin-top: 10%"> <img src="rsc/self4.jpg" id="aboutPic">
</div> </div>
</div> </div>
</div> </div>