Ok guys sorry I have to ask this :(

Question

Ist ok if I block my website from small screens because my website I iframe other websites games and my website is about gaming so ist ok or I should allow it to all devices, it's hard to make it responsive I make button responsive the image goes when make image responsive the button goes please help me thanks :).

Answer 1

Nice sick! background. So you just want that button in the center of screen?
Easy. Only issue is you named it homebtn1, its a start button, name things as they are.

Anyway you have it left 10% so it will always be left. And use absolute. Simple fix. You almost had it right.

@media (max-width: 768px) {

  .homebtn1 {

   position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

    width: 140px;

    height: 40px;

  }
   

Answer 2

As web developers today, it is important to focus on mobile-first web design, as over 58% of global web traffic today is from mobile devices.
We can use media queries to optimize our sites for smaller devices.
You mentioned iframes; it may be possible to turn that into a responsive container.
What are ways you have tried to make your webpage responsive?
It would be helpful if you shared a code example or your website.

Answer 3

Chris Coder oh my God thats so simple it helped thanks a lot brother ❤️❤️❤️❤️

Answer 4

Chris Coder also this is my website link infnomercy.netlify.app

Answer 5

Mihaly Nyilas why that's what I liked to use do you mean never use background video or what ?

Answer 6

Chris Coder I'm going to make it for iPad and iPad pros tablets thanks once again 😍

Answer 7

Hi, Kamre Aly If you have a question about your code, I'd be happy to help you. But to get the attention you deserve you must create a new post.

Answer 8

Add this in the head tag:
<meta name="viewport" content="width=device-width, initial-scale=1.0">

Answer 9

https://sololearn.com/compiler-playground/W2GKeNf4tn6L/?ref=app

Answer 10

Chris Coder ok so I tried media queries alot but still it doesn't worked cuz I make it responsive for iPhone it looks bad in Android when I make it for other same thing happens, and I all upload my website now then you can check in developer tool my website.

Answer 11

I think you have to try:
bootstrap

using flexbox....

or maybe tailwind, but with flexbox as well

Answer 12

Mihaly Nyilas will the thing is I have to design it like pro I want the button at the center of screens margin and stuff I tried every thing

Answer 13

Mihaly Nyilas Chris Coder also this is my website link infnomercy.netlify.app

Answer 14

1. don't use this background video

2.0 with bootstrap you can do it
2.5 with tailwindcss you can do it

hint: use cards

Answer 15

Tyler Banks You're welcome, thanks for following up so quickly and providing the links.- Happy Coding!

Answer 16

+१

Answer 17

import pygame
import sys

# Initialize pygame
pygame.init()

# Screen dimensions
width, height = 800, 600
screen = pygame.display.set_mode((width, height))
pygame.display.set_caption("Simple Gun Game")

# Colors
white = (255, 255, 255)
black = (0, 0, 0)

# Load images
gun_image = pygame.Surface((50, 20))
gun_image.fill(black)
bullet_image = pygame.Surface((10, 5))
bullet_image.fill(black)

# Gun position
gun_x, gun_y = width // 2, height - 50
bullet_x, bullet_y = gun_x, gun_y

# Bullet state
bullet_state = "ready"

# Clock
clock = pygame.time.Clock()

def draw_gun(x, y):
screen.blit(gun_image, (x, y))

def draw_bullet(x, y):
screen.blit(bullet_image, (x, y))

def fire_bullet(x, y):
global bullet_state
bullet_state = "fire"
bullet_y -= 10

while True:
for event in pygame.event.get():
if event.type == pygame.QUIT:
pygame.quit()
sys.exit()

keys = pygame.key.get_pressed()

if keys[pygame.K_LEFT]:
gun_x -= 5
if keys[pygame.K_RIGHT]: