diff --git a/index.html b/index.html index 0fb75c8631bed01498a16d1d3a84538791b4c632..1de76795356b89cdc8aa78bf67bf4caf52822721 100644 --- a/index.html +++ b/index.html @@ -102,7 +102,7 @@ <img class="article-image" src="img/astronaut.jpg" alt="" /> - <div class="article-content overlay"> + <div class="article-content"> <div class="overlay"> <h4 class="overlay-title">Expedition 48</h4> <h4 class="overlay-description">NASA's Record-braking Astronaut Crewmates Safely Return to Earth. Here is some additional information to the article where you can read more!</h4> diff --git a/styles.css b/styles.css index e0cf171827b722f39b5390c7cff87b64aa5d8579..a9e385471bdb6fe5c4219e1e165c114ab6d9605b 100644 --- a/styles.css +++ b/styles.css @@ -364,6 +364,8 @@ main { justify-content: flex-start; align-items: flex-start; position: absolute; + width: 100%; + height: auto; bottom: 0; left: 0; } @@ -386,6 +388,9 @@ main { max-height: 2.9rem; line-height: 1.1rem; overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + width: 100%; color: #111111; font-size: 0.9rem; flex: 1 1 auto; @@ -394,6 +399,7 @@ main { .overlay > .overlay-description:hover { max-height: 100%; overflow: visible; + white-space: normal; } .nasa-launch {