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!
Related
i have a menu bar that has 3 anchor elements and i want to load the content of those elements while staying on the same page.
i want to do so without making linking to another html file that has those contents.
i have tried adding id's to the divs and linking to them with an anchor element but that doesnt make the other content disappear no matter what link i am on
<div class = "logo">
<img src="logo-removebg-preview.png">
</div>
<nav>
<ul>
<li>Home</li>
<li>About</li>
<li>Programs</li>
<li>Library</li>
<li>Gallery</li>
<li>عربي</li>
</ul>
</nav>
</header>
<main>
<section class = "inner-section">
<div class="sub-menu">
<ul>
<li>Who We Are</li>
<li>Our Values</li>
<li>History & Structure</li>
</ul>
</div>
<div class="wrapper">
<div id ="who-wrapper"class="who-body">
<h3>Who We Are?</h3>
here is the image
You can use anchor tag to call the specific section
Anchor content
<section id="id_of_section">
some content here
</section>
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..
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>
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
<!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>