Processing instruction not closed error in html - html

Hi i am very new to developing , I started to type HTML code in eclipse but it showing processing instruction not closed error .I don't know how to solve please help me .. Thanks in advance
<!DOCTYPE html>
<html>
<body>
<div class="banner_page">
<div style="width: 90%; margin: 16px 0px 16px 104px;"></div>
<div class="header_menu">
<div style="float: left;">
<ul>
<li>Home</li>
<li>Pages</li>
<li>Mega menu</li>
<li>Gallery</li>
<li>Blog</li>
<li>Support</li>
<li>Contact</li>
</ul>
</div>
</div>
</div>
</body>
</html>

Select all your code, then BACKSPACE, then CTRL+Z to revert back the changes.

Just close the JSP tab and reopen it will solve

Select all your code CTRL+A, copy it CTRL+С.
Delete original file.
Create a new file with the same name, paste CTRL+V the copied code and save changes.

I tabbed your code out and it appears you are missing a closing DIV tag
<!DOCTYPE html>
<div class="banner_page">
<div style="width: 90%; margin: 16px 0px 16px 104px;"></div>
<div class="header_menu">
<div style="float: left;">
<ul>
<li>Home</li>
<li>Pages</li>
<li>Mega menu</li>
<li>Gallery</li>
<li>Blog</li>
<li>Support</li>
<li>Contact</li>
</ul>
</div>
</div>
</div>
<!-- you need another closing div tag here for banner_page -->
</body>
</html>

I got rid of the error by the following steps...
Ctrl + All
Ctrl + x
Ctrl + save
close the html file
Reopen the same html file
Now save the cut code from the former
Now all the errors disappeared

Related

Browser is overriding all elements in my code and turns them into links

I recently started to learn CSS and HTML and I am doing a front page for exercise. However, the browser is overriding and turning my other elements (in different div) into links. I tried CSS to solve it, nothing worked. I removed all CSS and it still is the same.
The container div and all the elements inside it is are now links and when I click, it tries to redirect to hrf.html page.
Can you please tell me where I am doing a mistake?
Elements in container div in the dev tool have this code:
a:-webkit-any-link {
color: -webkit-link;
cursor: pointer;
text-decoration: underline;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Conquer</title>
<link rel="stylesheet" href="styles.css" type="text/css">
</head>
<body>
<div class="nav">
<div class="nav2">
<ul class="navlist">
<li><a href="hrf.html">Homepage</li>
<li><a href="hrf.html">About Us</li>
<li><a href="hrf.html">Services</li>
<li><a href="hrf.html">Contact</li>
<li><a href="hrf.html">External</li>
</ul>
</div>
</div>
<div class="container">
<div class="first-sec">
<div class="first-img">
<img src="image1.jpg" alt="image">
</div>
<div class="heading">
<h1>CONQUER</h1>
<h2>Simple Website Design</h2>
</div>
</div>
</div>
</body>
</html>
it is necessary to close the tags properly otherwise there scope will disturb effects of other tags too..here in your code you forget to close <a> anchor tags thats why its become worry for you..try this
<div class="nav">
<div class="nav2">
<ul class="navlist">
<li>Homepage</li>
<li>About Us</li>
<li>Services</li>
<li>Contact</li>
<li>External</li>
</ul>
</div>
</div>
Best of luck ahead
This is because you haven't closed any <a> tag. You must close it or else you will face same issue.
<li>Homepage</li>
Follow this practice in all <li> elements.
That should fix your code. Let me know.
you haven't closed the anchor tags inside your "navlist" class.
<li>Homepage</li>
<li>About Us</li>
<li>Services</li>
<li>Contact</li>
<li>External</li>
try this..

How to put my text under my navigation bar?

Okay so I have a nav bar for my website and I have never ran into this issue. All my text goes right behind my nav bar and not under. It could be because my navbar is made to auto adjust for mobile screens.
<body>
<nav>
<h1 class="brand">CHS Robotics</h1>
<ul>
<li>Club Info</li>
<li>The Team</li>
<li>Positions</li>
<li>News</li>
<li>Donate</li>
<li>Sign up</li>
<li>Login</li>
</ul>
<div style="clear: both"></div>
</nav>
<div class="responsive-bar">
<h3 class="brand">CHS Robotics</h3>
<h4 class="menu">Menu</h4>
<div style="clear: both"></div>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".menu").click(function(){
$("nav").slideToggle(500);
})
})
<h1 class="about">About CHS Robotics</h1>
More info: Cyrusmusic101.github.io
I suggest you clear your cache, since there's nothing wrong with the code and it seems perfectly fine when I access the link.
(Also, if something were wrong it would probably be the CSS, so it'd be useful to also post it).

Linking in html5

I am unable to link to html5 section within same page.
Here's the code:
<div id="nav">
<ul>
<li>Contact</li>
<li>Services </li>
<li>About</li>
<li>Home</li>
</ul>
</div>`
<div id="contact">
<h2 id="contact">How to find Us?</h2>
Why is not going to the section "Contact" on the same page but it's trying to open new page: "http://example.com/contact ?
Contact
<div id="contact">my contact</div>
you forgot the #
<ul>
<li>Contact</li>
</ul>
<a name="yourAnchor"></a>
<div id="contact">
<h2>How to find Us?</h2>
</div>
Try this.
Thanks for help. Yes, I forgot to put # (due too many changes/toubleshooting).
I've put the # and I've used unique id for href - that worked like a charm!
Thanks again #TypedSource and #user3713452 for your help!

how to link to an id and an iframe inside it?

I have one iframe on my index page that I want to have links to different pages. But I also want the link when clicked to navigate down to the actual frame, as right now it is just staying at the top of the page. I am quite confused about this.
Here is my code:
HTML
<header>
<div id="logo">
<img src="../../assets/images/logo.png" alt="">
</div>
<nav>
<ul>
<li>TOURS,PRICES & STANDARD FLIGHTS</li>
<li>MEET THE STAFF</li>
<li>Gallery</li>
</ul>
</nav>
<div id="mainInfo">
<iframe src="about:blank" name="iframe"></iframe>
</div>
I think you're thinking of anchored links:
<li>Gallery</li>
And iframegallery.html:
<div id="mainInfo">
<iframe src="about:blank" name="iframe" id="iframe"></iframe>
</div>

Cannot get CSS to apply to HTML file

<!DOCTYPE html>
<html>
<head>
<meta charset=“UTF-8” />
<title>Footer Design</title>
<link rel=“stylesheet” type=“text/css” href=“style.css” />
</head>
<body>
<div id=“footer”>
<div id=“footer-col-one”>
<h3>Categories</h3>
<ul>
<li>Snow</li>
<li>Surf</li>
<li>Travel</li>
</ul>
</div>
<div id=“footer-col-two”>
<h3>Navigation</h3>
<ul>
<li>Home</li>
<li>About</li>
</ul>
</div>
<div id=“footer-col-three”>
<h3>Follow Me</h3>
<ul>
<li>Facebook</li>
<li>Twitter</li>
<li>Instagram</li>
</ul>
</div>
</div>
</body>
</html>
For some reason I cannot get my CSS stylesheet to apply. It's not the same directory as this html file. I'm using TextEdit and set it up for use with html & css. I did notice that any where I had double quotes I'm getting some weird output on Chrome Developer Tools like the following:
<link rel=“stylesheet†type=“text/css†href=“style.css†/>
You can't delimit HTML attribute values with “ characters, you must use " or '.
Left/Right quotes will be treated as part of the value (and thus the URL) and not as HTML special characters.
Your problem is most likely caused by writing code using a Word Processor with Smart Quotes turned on. Use a text editor (I'm fond of Sublime Edit 2 myself, but there are many other excellent choices such as Komodo Edit and Brackets).
This would have been picked up (albeit not explicitly) had you used a validator.
Please use this source formatting .Do not use “ . Use " . If your style.css file is in the other location means suppose that style.css is in the css folder so give the path like href="css/style.css"
Hope the answer and use this below html code which I have modified!
Footer Design
<body>
<div id="footer">
<div id="footer-col-one">
<h3>Categories</h3>
<ul>
<li>Snow</li>
<li>Surf</li>
<li>Travel</li>
</ul>
</div>
<div id="footer-col-two">
<h3>Navigation</h3>
<ul>
<li>Home</li>
<li>About</li>
</ul>
</div>
<div id="footer-col-three">
<h3>Follow Me</h3>
<ul>
<li>Facebook</li>
<li>Twitter</li>
<li>Instagram</li>
</ul>
</div>
</div>
</body>
</html>