Everywhere it looks the same, pc, macbook, any laptop, android devices... only on iphone everything looks different: font, font-weight, paddings, margins etc. I tried cleaning cookies and cache, and trying it from incognito mode, but it looks bad everywhere. Styles…
I'm trying to add elements to a card while the mouse is hovering over the card (like netflix cards), however when the cursor is moved to where the new button appears the mouseout event is triggered and the button cannot…
in tablet and phone devices i'm struggling to force my body's footer to the bottom of the page to sit above the page footer. I've tried setting the bottom to 0 to no avail. this is the current display when…
I went to websites like Amazon, Zomato, and Swiggy when I opened the developer tool I realized they are not using <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">. If I load their website in desktop mode and then I decrease the screen…
I try to create and use an animated hamburger menu icon instead of already made icons for my Navbar component `const menu = document.querySelector('.menu_button'); const showMenu = document.querySelector('.mobile-nav'); let menuOpen = false; console.log(menu); menu.addEventListener('click', () => { if(!menuOpen){ menu.classList.add('close'); showMenu.classList.add('open');…
i have a scaffold that keeps giving me overflow errors when i test on different phones. i only used mediaquery.of(context).size.height once in the code and i get overflow error 0f 40.392 and it makes no sense since i never used…
I am having a background image on top of that need to place sub images which will look like connection to a circuit. Current Result: .container { background-image: url('https://i.stack.imgur.com/AfygH.png'); height: 400px; background-position: center; background-size: stretch; background-repeat: no-repeat; } .coil {…
I have to fix the footer in a non-responsive site. All the content (but the footer) is placed in a CSS declaration called ".centrado". It has a fixed width: .centrado{ margin:0 auto; width:1170px; height:auto; display:block; overflow:hidden; } I need a…
Ive been trying to get my navigation to resize with the windows width, but as soon as i resize the window the animation elements dont resize with it. I got to scroll to the right in order for me to…
I have a checkbox in my form. Here is the code: input[type="checkbox"] { transform: scale(1.3); text-align: center; padding: 5px; display: inline; } div.checkbox label { display: inline; /* margin-left: .5rem; */ <div class="checkbox"> <h2>Choose your favorites programming languages (optional)</h2> <input…