This one got me really stumped. I have stripped a problematic website of basically everything, being left with the most trivial barebone site you can imagine:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Test site</title>
</head>
<body>
<img src="http://placekitten.com/200/300" />
</body>
</html>
...and yet, the img tag doesn't work. I get an empty website - and the W3 validator throws errors like Element img not allowed as child of element body in this context. (Suppressing further errors from this subtree.). What am I doing wrong? I have no idea what can be causing issues in a markup that consists of basically no elements other than the img and the ones required.
<!DOCTYPE html>
<html>
<body>
<img src="http://placekitten.com/200/300" alt="W3Schools.com"
style="width:104px;height:142px;">
</body>
</html>
As mentioned in the comment, there were 2 invisible characters after img and src.
I used text-compare to figure out this, please refer the attached screenshot.
Related
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<img src="DFDD.png">
</body>
</html>
the image is not showing while using links is there something wrong with it, the image is in the same folder...i am using brave browser...the webpage is when run completely blank....really can't figure out whats wrong with it
//this problem occurs only while using the live server extension of vs-code..
try to use ./YOUR_IMAGE_NAME instead of just YOUR_IMAGE_NAME. I hope it will work.
I am making a survey and I need to centre the h1 in the centre of the page. It seems to work on Codepen.io but doesn't seem to work on VS-CODE.
This is my HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Milkshake Survey 2020</title>
</head>
<body>
<h1 id="MS">Milkshake Survey</h1>
</body>
</html>
and CSS:
#MS {
text-align:center;
}
It seems to have worked on code.io
link: https://codepen.io/abhirajsb/pen/xxVgGwj
But on VSCODE it does not seem to work and the title is always on the left.
I need to know what mistakes i am making. (i am a beginner)
I had to include a link in my HTML file to connect the HTML page to the css.
<link rel="stylesheet" href="survey.css">
Thank you to #rioV8 for the quick response and others for the contribution.
Sorry, a designer here (not a developer). I am having an issue with only the first attribute being applied and inability to apply any others after the first one. I know the best way is through CSS, but sometimes a need a quick simple job and can't spend the time to develop or edit a CSS properly.
Here's what I have, what is wrong?:
<!DOCTYPE html>
<html>
<body>
<div style="text-align:center;" style="font-decoration-style:bold;" style="text-decoration-color:red;">Helloooo!</div>
</body>
</html>
Sorry but you can only have one attribute of a kind for each element in HTML.
Try this instead:
<!DOCTYPE html>
<html>
<body>
<div style="text-align:center; font-weight:bold; color:red;">Helloooo!</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>My Page</title>
<link rel="stylesheet" href="main.css" />
</head>
<body>
</body>
</html>
When I run this code, I see 'My Page' in my Browser's Title Bar and in Body too!
Why am I getting this?
Because <head> and <title> are just tags, like anything else. And the * selector picks them up too.
For kicks, take a look at this fiddle, which clearly demonstrates when you give head and title a display:block style, they indeed show up as text on the page:
HTML
<body>
<p>hi</p>
</body>
CSS
head, title {display:block}
Output
- jsFiddle demo
hi
For a bit more fun, we can color things too. And we even learn something about the inner workings of JSFiddle in the process. It looks like they inline your style in a <style> tag inside the <head>. Ha!
No. It doesn't and wouldn't output such a result. Have you tried refreshing/clearing the cache of your browser?
im currently makeing some form
you can see at http://jsfiddle.net/AnMSa/
it is working fine
but when i run it on my localhost.. it turns like
ive countered this bug till yesterday, and now its time to me to look for help.
heres the html if anybody wants to download it http://www.mediafire.com/?vzi7kjgcdzldh48
please tell me everything that can reproduce this kinda bug.
The html file isn't valid html. it doesn't include the html or body tags or the doctype.
It works fine if you add your content in the following:
<!doctype html>
<html>
<body>
<!-- add content here -->
</body>
</html>
Or you can use the html5 boilerplate code from http://html5boilerplate.com/
You have to determinate your Doctype.
<!DOCTYPE html>
<html>
<head>
<style>
</style>
</head>
<body>
<!--- content -->
</body>
</html>
Do it and it will be fixed. You see it ok onjsfiddle because they have already defined the Doctype.