Responsive design in Android does not function as intended

My goal is to create a responsive design for my website, but I am encountering issues with importing the CSS files into the HTML. When I try to view the site in both the Windows version of Chrome and the Android version, all I see is a white screen. I am currently debugging via USB through Chrome.

Here are the files:

HTML

<?php 
require_once("Includes/simplecms-config.php"); 
require_once("Includes/connectDB.php");
require_once("Includes/session.php");
?>
<!DOCTYPE html>
<html>
<head>
<meta name="keywords" content="">
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" href="../Styles/global-style.css"> 
<link rel="stylesheet" href="../Styles/font-face.css">    
<link rel="stylesheet" href="../Styles/input.css">        
<script src="../script/main_script.js"></script>
<title></title>
</head>
<body id="fullWrapper">
    <div id="logo">the point</div>
</body>
</html>

The mobile version is located in a directory called 'mobile', so the link would be:

localhost:8080/mobile/index.php

And the CSS files can be found at:

localhost:8080/styles/global-style.css

localhost:8080/styles/font-face.css

localhost:8080/styles/input.css

I have attempted to adjust the file locations for the CSS files, placing one in the main directory folder and another in the mobile folder.

javascriptandroidhtmlcss

Answer №1

If you want to optimize your website for mobile devices, take a look at the Chrome Developer Tools Device Mode feature available here: https://developer.chrome.com/devtools/docs/device-mode.

This tool enables you to simulate various devices directly within your desktop browser, making it simpler to identify and resolve any issues that may arise.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The timing of the RequestAnimationFrame function varies based on the dimensions of my canvas

In my application, I have a canvas that dynamically adjusts its CSS size based on the window size. The main gameplay loop in my code looks like this: run = function(){ console.log(timerDiff(frameTime)); game.inputManage(); game.logics(); ...

javascripthtmlcanvasrequestanimationframe

Converting MSK time to SST time using JavaScript: A Handy Guide

My API returns time in the format: 07:00 PM This timestamp is based on MSK (Moscow Standard Time) and I need it converted to SST (Singapore Standard Time) using either JavaScript or an npm package. ...

javascriptreactjsreact-nativedatenpm

How can I create multiple divs that look alike?

I've taken on the challenge of developing our own interpretation of Conway's "Game of Life" for a project. To represent my 20x20 grid, I decided to create nested divs - the whole grid is one div, each row is a div, and every cell within that is a ...

javascriptjqueryhtml

JavaScript - Declaring canvas as a global object

Presently, I am experimenting with HTML5 and using JavaScript to create a basic 2D Tile map. Progress is going smoothly; however, I have come across an issue where I am unable to contain everything within one large function. I am attempting to make the ca ...

javascripthtml

Maintain the chosen month in every dropdown toggle div in angular 4

While displaying data using toggle options, I am facing an issue where if I click on a different month, all other greyed out headers are displaying the previously selected values. I am trying to figure out a way to keep the value under Selected month as i ...

javascriptangularngfor

I am currently running a recursive loop to fetch data from MongoDB. However, the Express.js function runs through the entire script before the data can be successfully returned

Can someone assist me with setting up my Express route to handle the return of data from a recursive function that involves promises and fetching MongoDB data? Currently, my route is executing immediately without sending the data back to the client. The da ...

javascriptmongodbexpress

Removing sourceMappingURL from an Angular Universal build: A step-by-step guide

Using this repository as my foundation, I have successfully resolved most of the plugin errors except for one that continues to elude me. It's puzzling because no other plugin anticipates a .map file in an SSR build since it is intended for productio ...

javascriptangularangular-universalserver-side-rendering

Issue with alignment in the multiselect filter of a React data grid

In React Data Grid, there is a issue where selecting multiple filter options messes up the column headers. Is there a solution to display selected filter options above a line in a dropdown rather than adding them to the column header? The column header siz ...

javascriptcssreactjsreact-data-grid

mention a Vue.js component computed property that points to a specific DOM element

Is there a way to access the DOM element that initiated a method inside a Vue component computed property? For example: <template> <img :src="getUrl" class="image1"/> <img :src="getUrl" class="image2"/> </template> <scri ...

javascriptvue.jsvuejs2vue-component

The basic CSS container fails to properly align its elements as intended

Recently, I created a CSS div using Bootstrap and added some custom styling. You can check out the fiddle for a live demo of the code: https://jsfiddle.net/w9gyc0t5/. Here's the actual code: <!-- Bootstrap docs: https://getbootstrap.com/docs -- ...

htmlcss

How can I make the arrows work on a secondary slider with EasySlider1.7?

I finally managed to get 2 sliders working on my page after reading through several other tutorials. However, I am facing an issue with the Prev & Next arrows on the second slider as they don't seem to work properly. I inherited this page from someon ...

javascriptjqueryhtmlcsseasyslider

What could be causing this hydration error in NextJS in the development server build but not in the production build?

By using the create-next-app command and implementing this code snippet, a hydration error occurs on the client side when running the next dev server. The code in pages/index.js: export async function getServerSideProps(context) { const x = Math.random( ...

javascripthtmlnext.jsserver-side-renderingdangerouslysetinnerhtml

Unleashing the potential of extracting the value of a subsequent iteration while within the

Currently, I am facing a dilemma as I am unable to comprehend the logic required to design this algorithm. The problem at hand involves a sequence of images with arrows placed alternatively between each image. The structure appears as follows: Image -> ...

javascriptjqueryjsonalgorithm

Utilizing Sequelize to search for existing items or create new ones in a list

My experience with sequelize is limited and I am having trouble understanding certain aspects. Despite my efforts to search for more information, I couldn't find anything specific that addresses my confusion. // API Method function SeederApi(req: Req ...

javascriptnode.jstypescriptsequelize.js

The HTML elements in my JSX code seem to constantly shift around whenever I resize my webpage

Using react.js, I'm currently developing a website that appears like this before resizing: pre-resize_screenshot_website However, upon vertical or diagonal resizing, the layout becomes distorted especially in the 'availability search bar' ...

javascripthtmlcssreactjs

Creating intricate mazes using canvas drawing techniques

I recently developed a maze generator as a personal project utilizing a graph. While the generation logic works perfectly, I am facing challenges when it comes to rendering the maze. In my approach, each cell is represented by an array of 4 edges where the ...

javascripttypescriptcanvasmaze

Comparison of universal and descending selector in CSS

Can someone clarify when to use the universal selector versus the descendant selector in CSS? I've tried finding a clear explanation, but haven't come across one that explains the difference and when each should be used: div * .test{ color: re ...

htmlcsscss-selectors

The setInterval() function is not functioning properly when used with PHP's file_get_contents

Currently, I'm encountering an issue while attempting to use the function get_file_contents() within a setInterval(). The objective is to continuously update some text that displays the contents of a file. Below is the code snippet: <script src="h ...

javascriptphpjqueryfile-iosetinterval

Interact with visible elements by automating mouse clicks with puppeteer

When attempting to click on various elements within a page, my goal is to do so only if they are visible. While achieving this in selenium with the is_displayed method was simple, I have struggled to find a similar approach in puppeteer. I attempted to imp ...

javascriptseleniumpuppeteer

Guide to sending a response to an AJAX post request in Express with Node.js: Answered

For a project focused on practicing Node.js and jQuery Ajax, I'm working on a simple task. Essentially, I have an ajax post request that sends data to a Node.js server and waits for a response. On the server-side, there's code that processes this ...

javascriptjquerynode.jsajaxexpress