Search the Community
Showing results for tags 'media tags'.
Found 1 result
-
Hello! I am new to html and css, and am having an issue with media queries! I am just trying to get my site to be responsive for these three different px sizes and cant get it to action. I reverted from the second css media query shown below because it was not working at all, not even showing any attempt to change when inspected in the browser. Am I missing something? Thanks! My @media is as shown: @media screen and (max-width: 980px) { } @media screen and (max-width: 768px) { } @media screen and (max-width: 640px) { } I had but reverted to the above when nothing was taking effect.. @media screen @media screen (max-width: 640px) { #cwm { width: 550px; margin: 10px; } } My html : <!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/css" href="../Basic-Portfolio/assets/css/style.css"> <!--script type="text/javascript" src="../Basic-Portfolio/assets/Java/slideshow1.js"></script--> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>The Nerdadian</title> </head> <body> <header> <div class="navBar"> <nav> <ul class="header"> <li><a class="home" href="default.asp"><h2>Tanner Martin</h2></a></li> <li><a class="nav" href="../Basic-Portfolio/index.html">About</a></li> <li><a class="nav" href="../Basic-Portfolio/portfolio.html">Portfolio</a></li> <li><a class="nav" href="../Basic-Portfolio/contact.html">Contact</a></li> </ul> </nav> </div> </header> <br> <br> <br> <div class="standard"> <div class="block"> </div> <br> <div id="aboutme" class="standard"> <h1 id="H2">About Me</h1> <br> <img id="img1" src="../Basic-Portfolio/assets/images/ME!.jpg"> <br> <p id="P1"> Hello! My name is Tanner Martin. I was born in Texas, but lived in Canada for my Junior High and High School life, so I consider my self Canadian :). None of you know this, but I have an amazing little girl named Olivia!She will turn one on October 5th. I am going to teach her to be a gamer, programmer, and just generally awesome, though she already has the awesome part covered.</p> <p id="P2"> I am a nerd of sorts, I collect video game memorabilia, figures of various genres, i computer game, and build my own PCs. My most played game at the moment would either be Diablo 3, or PuBG (Player Unknown Battlegrounds). I just started playing a new game called Depth, if I were to describe it, you would probably think it is lame; So i suggest you try it out for yourself. Recently I have had to startselling my figures, so my collection isn't what it used to be, but here is an old picutre for reference.. (Still not complete collection) <br> <img src=""> <br> </p> <div class="slideshow-container"> <div class="Slideshow1"> <div class="numbertext">1 / 3</div> <img src="../Basic-Portfolio/assets/images/domo-will-eat-you.jpg" style="width: 100%"> <div id="text1">Domo Will Eat You!</div> </div> <div class="Slideshow1"> <div class="numbertext">2 / 3</div> <img src="../Basic-Portfolio/assets/images/dunnykings-orders.jpg" style="width: 100%"> <div id="text2">Dunny King's Orders..</div> </div> <div class="Slideshow1"> <div class="numbertext"> 3 / 3</div> <img src="../Basic-Portfolio/assets/images/old-collection.jpg" style="width: 100%"> <div id="text3">Old Collection</div> </div> <a class="prev" onclick="plusSlides(-1)">❮</a> <a class="next" onclick="plusSlides(1)">❯</a> </div> <br> <div> <span class="dot" onclick="currentSlide(1)"></span> <span class="dot" onclick="currentSlide(2)"></span> <span class="dot" onclick="currentSlide(3)"></span> </div> <script> var slideIndex = 1; showSlides(slideIndex); function plusSlides(n) { showSlides(slideIndex += n); } function currentSlide(n) { showSlides(slideIndex = n); } function showSlides(n) { var i; var slides = document.getElementsByClassName("Slideshow1"); var dots = document.getElementsByClassName("dot"); if (n > slides.length) {slideIndex = 1} if (n < 1) {slideIndex = slides.length} for (i = 0; i < slides.length; i++) { slides.style.display = "none"; } for (i = 0; i < dots.length; i++) { dots.className = dots.className.replace(" active", ""); } slides[slideIndex-1].style.display="block"; dots[slideIndex-1].className+="active"; } </script> <p id="P3"> I love to travel! My goal is to live on every continent for at least 2 years by the time I pass away. I lived in Greece for three months, so Europe has been partailly completed! Even though I was born in the US, I lived in Canada for my JuniorHigh and High School careers. If you would like to contact me, drop me a message <a href="contact.html">Here!</a> </p> </div> <div id="cwm"> <h3>Connect With Me</h3> <a href="https://github.com/Twmartin1147"><img class="img2" src="../Basic-Portfolio/assets/images/github-sq-bl.png"></a> <a href="https://www.linkedin.com/in/tanner-martin-1147/"><img class="img2" src="../Basic-Portfolio/assets/images/linkedin-sq-blu.png"></a> <a href="https://stackoverflow.com/users/8673657/tanner-martin"><img class="img2" src="../Basic-Portfolio/assets/images/stackoverflow-sq-yel.png"></a> <br> </div> </div> <footer> </footer> </body> </html>
