CSS dosn't work when calling localhost

Problems with the Windows version of XAMPP, questions, comments, and anything related.

CSS dosn't work when calling localhost

Postby IRealyNeedHelp » 17. May 2021 17:57

Hello Guys,

my Name is Pane and I have got a weird problem. I want to make a Registration forum and I need PHP and MySQL for this. I overcomed a big problem with localhost, then i was realy happy. I programmed further and then, there was the next problem. When I open my Registration forum with localhost, there is no CSS. I tried to make the CSS in the HTML-File but it still didn't work. I asked some friends and a Youtuber, but both of then said the same, that everything is correctly. So now I am here and don't know what to do. I realy hope you can tell me that the problem is. The style.css file and the Registration.html file are in the same folder. This is the code of my style.css I am from Germany so don't be confused. I would be realy happy if you could tell my.

Code: Select all
<!doctype html 5>

<html>
<head>
<link rel="stylesheet" href="style.css" type="text/css">
<title> Regestrierung</title>
<meta name="robots" content="noindex" />
</head>
<body>
<div id="a">
<section>
<header>Titel</header>
<form>
<fieldset>
<legend>Bitte merke dir deine Zugangsdaten</legend>
<p>
<label for="username" class="sr-only">Name</label>
<input type="text" name="username" size="100" id="idname" class="form-control" placeholder="Name" autocomplete="username" required>
<p>
<label for="email" class="sr-only">E-Mail</label>
<input type="email" name="usermail" size="100" id="idmail"  class="form-control" placeholder="E-Mail" autocomplete="usermail"required>
</p>
<p>
<label for="password" class="sr-only">Passwort</label>
<input type="password" name="userpassword" size="100" id="idpass" class="form-control" placeholder="Passwort" autocomplete="current-password" required>
<input type="checkbox" name="rememberusername" id="rememberusername" value="1"  />
<label for="rememberusername" id="checkmark">Namen merken</label>
</p>
<button type="submit" name="login" value="weiter" id="loginbtn">Weiter</button>
</a>
</fieldset>
</form>
<footer>
<p><a href="#">&copy; 2020 Pane</a></p>
</footer>
</body>
</html>
IRealyNeedHelp
 
Posts: 6
Joined: 17. May 2021 17:37
XAMPP version: 8.0.3
Operating System: Windows 10 Pro

Re: CSS dosn't work when calling localhost

Postby Altrea » 17. May 2021 18:56

Your code is working on my test environment.
So there must be a problem somewhere you didn't tell us.
For example in the naming of the css file, in the css code or something completely different.

First try to find out if the css file can be loaded successfully. This can be done for example with the Google Chrome web developer tools (F12).
If this is successful try to replace your css code in there with something trivial, like
Code: Select all
body {
   background-color: #cc0000;
}


At the end it is not a XAMPP issue at all. CSS formating is completely done in your clients browser.
We don't provide any support via personal channels like PM, email, Skype, TeamViewer!

It's like porn for programmers 8)
User avatar
Altrea
AF Moderator
 
Posts: 11926
Joined: 17. August 2009 13:05
XAMPP version: several
Operating System: Windows 11 Pro x64

Re: CSS dosn't work when calling localhost

Postby Nobbie » 18. May 2021 09:59

This is the code of my style.css


No, i dont see any CSS Code, thats plain HTML. By the way, there is a german forum as well, we dont need to write in english.
Nobbie
 
Posts: 13170
Joined: 09. March 2008 13:04

Re: CSS dosn't work when calling localhost

Postby IRealyNeedHelp » 19. May 2021 20:56

Altrea wrote:Your code is working on my test environment.
So there must be a problem somewhere you didn't tell us.
For example in the naming of the css file, in the css code or something completely different.

First try to find out if the css file can be loaded successfully. This can be done for example with the Google Chrome web developer tools (F12).
If this is successful try to replace your css code in there with something trivial, like
Code: Select all
body {
   background-color: #cc0000;
}


At the end it is not a XAMPP issue at all. CSS formating is completely done in your clients browser.


There is this error:
Failed to load resource: the server responded with a status of 404 (Not Found) style.css:1
Failed to load resource: the server responded with a status of 404 (Not Found) style.css:1

So it don't load the CSS, but I with the best of will not understand why. But you are the expert and I hope we can get this problem together out of my world.
IRealyNeedHelp
 
Posts: 6
Joined: 17. May 2021 17:37
XAMPP version: 8.0.3
Operating System: Windows 10 Pro

Re: CSS dosn't work when calling localhost

Postby IRealyNeedHelp » 19. May 2021 21:00

Nobbie wrote:
This is the code of my style.css


No, i dont see any CSS Code, thats plain HTML. By the way, there is a german forum as well, we dont need to write in english.

Sorry, i meant, that this is the code of my Registration.html, and yes I know that there is a german one, but this is an international, and here are maybe more intelligent people or people, who know more about troubleshootin in the subject XAMPP. Have a nice day!
IRealyNeedHelp
 
Posts: 6
Joined: 17. May 2021 17:37
XAMPP version: 8.0.3
Operating System: Windows 10 Pro

Re: CSS dosn't work when calling localhost

Postby Altrea » 19. May 2021 21:04

Double check that the file is really named style.css and not for example style.css.txt (which commonly happens if you use the Windows editor to create files).
We don't provide any support via personal channels like PM, email, Skype, TeamViewer!

It's like porn for programmers 8)
User avatar
Altrea
AF Moderator
 
Posts: 11926
Joined: 17. August 2009 13:05
XAMPP version: several
Operating System: Windows 11 Pro x64

Re: CSS dosn't work when calling localhost

Postby IRealyNeedHelp » 26. May 2021 15:58

Altrea wrote:Double check that the file is really named style.css and not for example style.css.txt (which commonly happens if you use the Windows editor to create files).


The first thing I want to say is that I am using Notepad ++, and yes, it's called style.css. You can tell me, if it is even possible how to send screenshots, then you will understand everything better
IRealyNeedHelp
 
Posts: 6
Joined: 17. May 2021 17:37
XAMPP version: 8.0.3
Operating System: Windows 10 Pro

Re: CSS dosn't work when calling localhost

Postby IRealyNeedHelp » 26. May 2021 16:05

Altrea wrote:Double check that the file is really named style.css and not for example style.css.txt (which commonly happens if you use the Windows editor to create files).

When I go to the folder that has the style.css file and the other 5 Chrome HTML documents and browse the style.css file, it turns out that this is a cascading style sheet document. I therefore suspect that this is a style.css and not, for example, a style.css.txt document
IRealyNeedHelp
 
Posts: 6
Joined: 17. May 2021 17:37
XAMPP version: 8.0.3
Operating System: Windows 10 Pro


Return to XAMPP for Windows

Who is online

Users browsing this forum: No registered users and 140 guests