enpaul
/
enpaul.net
1
0
Fork 0
Code Issues Pull Requests Releases Activity

Fixed overflow with giant logo on small screens

This commit is contained in:
Ethan N. Paul 2018-02-06 08:08:16 -05:00
parent 53e5a460e6
commit f2370a7d53
2 changed files with 13 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
css/style.css
View File

@ -90,14 +90,20 @@ h1, h2, h3, h4, h5, h6 {
background-size: cover; background-size: cover;
} }
#top .hero-logo { #top .top-logo {
margin: 20px; margin: 20px;
} }
#top .hero-logo img { #top .top-logo img {
max-width: 100%; max-width: 100%;
} }
@media (max-width: 768px) {
#top .top-logo img {
max-width: 50%;
}
}
#top .top-container { #top .top-container {
background: rgba(0, 0, 0, 0.3); background: rgba(0, 0, 0, 0.3);
display: table-cell; display: table-cell;
@ -170,9 +176,9 @@ h1, h2, h3, h4, h5, h6 {
--------------------------------------------------------------*/ --------------------------------------------------------------*/
#header { #header {
background: black; background: black;
padding: 15px 0; padding: 10px 0;
height: 55px; height: 40px;
margin-top: -80px; margin-top: -60px;
} }
#header #logo { #header #logo {
@ -294,7 +300,7 @@ h1, h2, h3, h4, h5, h6 {
/* Nav Meu Container */ /* Nav Meu Container */
#nav-menu-container { #nav-menu-container {
float: right; float: right;
margin: 5px 0; /*margin: 5px 0;*/
} }
@media (max-width: 768px) { @media (max-width: 768px) {

2
index.html
View File

@ -60,7 +60,7 @@
<section id="top"> <section id="top">
<div class="top-container"> <div class="top-container">
<div class="wow fadeIn"> <div class="wow fadeIn">
<div class="hero-logo"> <div class="top-logo">
<img class="" src="img/e-w.png" alt="ENPaul"> <img class="" src="img/e-w.png" alt="ENPaul">
</div> </div>