1
The archive Responsive.css is not being read by my website.
I’m calling it that:
<link type="text/css" rel="stylesheet" href="css/responsive.css">
Inside it is the following code:
@media screen and (max-width: 640px) {
.right-side { width: 100%; }}
In the case, the right-side is defined as 50%.
Which is not being applied when I emulate the browser in the mobile version. Galaxy S5 (360*640)
What can it be?
Already used your browser dev tool ([F12]) to check if the script has been loaded correctly and if no other style is conflicting with the rule? It may still be that the
@mediais suitable for resolution you are testing– Ricardo Pontual
Yes, this is where it doesn’t call. If I put the file path directly in the browser, it opens normally. Which resolutions you indicate to use in @media?
– Felipe Viero Goulart
Those of bootstrap I think it is good and well accepted: https://getbootstrap.com/docs/3.3/css/#grid-media-queries
– Ricardo Pontual
In this project I will not use Bootstrap. Which ones do you usually use?
– Felipe Viero Goulart
I don’t know how is the site navigation or the folders, but if you are not loading the
css, maybe you can try to force search from the site root with the bar:href="/css/responsive.css"– Ricardo Pontual
I understand, but if you look at the link, you’ll see that you have the resolutions used in bootstrap: Extra small Devices Phones (<768px), Small Devices Tablets ( 768px), Medium Desktops ( 992px), Large Desktops Devices ( 1200px). I try to copy the same :)
– Ricardo Pontual
You put your full HTML/CSS code including the
<head>from the page that helps. About the screen widths I think this answer can help you. https://answall.com/questions/272494/qual-tipo-de-medida-utilizada-na-hora-da-constru%C3%A7%C3%A3o-de-a-site-to-width-a/272537#272537– hugocsl