diff --git a/static/page.css b/static/page.css index 1352e12e94d432333873234e5da7fc1ea8af5442..f714a11f1baaa3e349af2dd57a34ee0c4ad93622 100644 --- a/static/page.css +++ b/static/page.css @@ -354,9 +354,8 @@ body{ font-weight: 600; margin-left: 60px; } -.img-pagestyle{ +/* .img-pagestyle{ margin: 20px auto 20px; - /* width and height of pictures! */ width: 50%; height: 50%; overflow: hidden; @@ -365,6 +364,19 @@ body{ width: 100%; height: 100%; object-fit: contain; +} */ +.img-pagestyle { + margin: 10px 0; /* Reduce space between image and text */ + width: 80%; /* Keep the width as per your preference */ + height: auto; /* Let the height adjust automatically */ + overflow: hidden; + padding: 0; /* Ensure no padding around the image */ +} + +.img-pagestyle img { + width: 100%; + height: auto; + object-fit: contain; /* Maintain aspect ratio */ } .pagecontent p { margin-top: 20px; diff --git a/wiki/pages/description.html b/wiki/pages/description.html index b4d609b26c85aee0e10b7ed6850e9bae7a8404db..4bc91299ef43c5b836c1a604027d43feac7c7276 100644 --- a/wiki/pages/description.html +++ b/wiki/pages/description.html @@ -24,7 +24,7 @@ <div class="h1">Background</div> <p>The Netherlands has been facing a pressing <strong>nitrogen crisis</strong> for several years. This crisis is largely attributed to the <strong>agriculture sector</strong>, with over 80% of ammonia (a nitrogenous compound) emissions coming from manure <a href="https://www.wur.nl/en/newsarticle/Nitrogen-crisis-in-the-Netherlands.htm" style="color: #C6EBE8;">[NitrogenWUR]</a> and chemical fertilizers <a href="https://www.government.nl/topics/nitrogen-crisis" style="color: #C6EBE8;">[TheGovernment.nl]</a>.</p> <p>The over-use of fertilizers has a detrimental effect on the environment through the deposition of excess nitrogen oxides and ammonia in the ground, excessively enriching the environment with nutrients promoting uncontrolled plant and algal growth, or eutrophication, a form of nutrient imbalance <a href="https://oceanservice.noaa.gov/facts/eutrophication.html" style="color: #C6EBE8;">[US Department of Commerce What is Eutrophication]</a> that negatively impacts the local biodiversity. This highlights the need of the hour: <strong>tackle the nitrogen crisis without negatively affecting food production</strong>, which still depends highly on fertilizers.</p> - <div class="img-pagestyle" style="width:80%; margin-top: 10px; margin-bottom: 0;"> + <div class="img-pagestyle"> <img src="https://static.igem.wiki/teams/5054/background.svg" alt=""> </div> </div>