My client would like their company name (the run throughout the US) to come up in a goolge search based on the zip code a user puts in the google. I figured it must be schema.org..I have found a similar site and this is the code source I found:
<!-- Top Bar -->
<div id="top_toolbar" class="clearfix">
<div class="container">
<div class="breadcrumbContainer">
<div class="breadcrumb" itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <span itemprop="title">TITLE HERE</span> </div>
<div class="breadcrumb" itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <span> <span itemprop="title">TITLEHERE </span> </span></div>
<div class="breadcrumb" itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <span> <span itemprop="title">In </span> </span></div>
</div>
</div>
</div>
If I was to google search "Something in 49117" this is the source code:
<div id="top_toolbar" class="clearfix">
<div class="container">
<div class="breadcrumbContainer">
<div class="breadcrumb" itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <span itemprop="title">TITLEHERE</span> </div>
<div class="breadcrumb" itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <span> <span itemprop="title">TITLEHERE </span> </span></div>
<div class="breadcrumb" itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <span> <span itemprop="title">In </span> </span></div>
<div class="breadcrumb" itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <span> <span itemprop="title">49117 </span> </span></div>
<div class="breadcrumb" itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <span itemprop="title">Instant Quote</span> </div>
</div>
Related
How do I display an image with style and background-image in ejs template
This is working:
But this is not working:
this is my full code
<div class="row d-flex">
<% upcoming_events.forEach(event=> { %>
<div class="col-lg-4 ftco-animate">
<div class="blog-entry">
<a href="blog-single.html" class="block-20" style="background-image: url('<%=event.eventImage %>' )">
</a>
<div class="text d-block">
<div class="meta">
<p>
<span class="fa fa-calendar mr-2"></span>Sept. 06, 2020
<span class="fa fa-user mr-2"></span>Admin
<span class="fa fa-comment mr-2"></span> 3
</p>
</div>
<h3 class="heading">Best for any industrial & business solution</h3>
<p>Read more</p>
</div>
</div>
</div>
<%}) ;%>
</div>
Note, when I inspect it on the browser it shows the AWS image URL correctly but the image does not show.
I have a question. I have a bootstrap (3) grid with 2 columns. insight the right column I am using 'center-block' to position elements in the center. For some reason it doesnt do nothing. What am I doing wrong? Thanks!!
https://jsfiddle.net/codingcodingcoding/mbw45xdh/1/
<section id="contact">
<div class="container-fluid">
<h2 class="section-heading text-center">Let's Get In Touch!</h2>
<div class="row">
<div class="col-md-6">
<div id="googleMap"></div>
</div>
<div class="col-md-6">
<div class="center-block">
<span class="glyphicon glyphicon-earphone phone-icon"></span>
<span class="glyphicon glyphicon-envelope email-icon"></span>
<p>
feedback#example.com
</p>
</div>
</div>
</div>
</div>
</section>
You have to use your text-center class in div element
like:
<section id="contact">
<div class="container-fluid">
<div class="text-center">
<h2 class="section-heading">Let's Get In Touch!</h2>
</div>
<div class="row">
<div class="col-md-6">
<div id="googleMap"></div>
</div>
<div class="col-md-6">
<div class="center-block">
<span class="glyphicon glyphicon-earphone phone-icon"></span>
<span class="glyphicon glyphicon-envelope email-icon">
</span>
<p>
<a href="mailto:your-email#your-
domain.com">feedback#example.com</a>
</p>
</div>
</div>
</div>
</div>
</section>
`<!DOCTYPE html>
<html class="no-js">
<head>
<!-- Basic Page Needs
================================================== -->
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="icon" type="image/png" href="images/favicon.png">
<title>Timer Agency Template</title>
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="author" content="">
<!-- Mobile Specific Metas
================================================== -->
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Template CSS Files
================================================== -->
<!-- Twitter Bootstrs CSS -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<!-- Ionicons Fonts Css -->
<link rel="stylesheet" href="css/ionicons.min.css">
<!-- animate css -->
<link rel="stylesheet" href="css/animate.css">
<!-- Hero area slider css-->
<link rel="stylesheet" href="css/slider.css">
<!-- owl craousel css -->
<link rel="stylesheet" href="css/owl.carousel.css">
<link rel="stylesheet" href="css/owl.theme.css">
<link rel="stylesheet" href="css/jquery.fancybox.css">
<!-- template main css file -->
<link rel="stylesheet" href="css/main.css">
<!-- responsive css -->
<link rel="stylesheet" href="css/responsive.css">
<!-- Template Javascript Files
================================================== -->
<!-- modernizr js -->
<script src="js/vendor/modernizr-2.6.2.min.js"></script>
<!-- jquery -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<!-- owl carouserl js -->
<script src="js/owl.carousel.min.js"></script>
<!-- bootstrap js -->
<script src="js/bootstrap.min.js"></script>
<!-- wow js -->
<script src="js/wow.min.js"></script>
<!-- slider js -->
<script src="js/slider.js"></script>
<script src="js/jquery.fancybox.js"></script>
<!-- template main js -->
<script src="js/main.js"></script>
</head>
<body>
<!--
==================================================
Header Section Start
================================================== -->
<header id="top-bar" class="navbar-fixed-top animated-header">
<div class="container">
<div class="navbar-header">
<!-- responsive nav button -->
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!-- /responsive nav button -->
<!-- logo -->
<div class="navbar-brand">
<a href="index.html" >
<img src="images/logo.png" alt="">
</a>
</div>
<!-- /logo -->
</div>
<!-- main menu -->
<nav class="collapse navbar-collapse navbar-right" role="navigation">
<div class="main-menu">
<ul class="nav navbar-nav navbar-right">
<li>
<a href="index.html" >Home</a>
</li>
<li>Sign Up</li>
<li>Log In</li>
<li>Contact</li>
</ul>
</div>
</nav>
<!-- /main nav -->
</div>
</header>
<!--
==================================================
Slider Section Start
================================================== -->
<section id="hero-area" >
<div class="container">
<div class="row">
<div class="col-md-12 text-center">
<div class="block wow fadeInUp" data-wow-delay=".3s">
<!-- Slider -->
<section class="cd-intro">
<h1 class="wow fadeInUp animated cd-headline slide" data-wow-delay=".4s" >
<span>EMPLOYEE TRAINING PROGRAMME</span><br>
<span class="cd-words-wrapper">
<b class="is-visible">(ETP)</b>
<b>DEVELOPER</b>
<b>FATHER</b>
</span>
</h1>
</section> <!-- cd-intro -->
<!-- /.slider -->
<a class="btn-lines dark light wow fadeInUp animated smooth-scroll btn btn-default btn-green" data-wow-delay=".9s" href="#works" data-section="#works" >View Programmes</a>
</div>
</div>
</div>
</div>
</section><!--/#main-slider-->
<!--
==================================================
Slider Section Start
================================================== -->
<section id="about">
<div class="container">
<div class="row">
<div class="col-md-6 col-sm-6">
<div class="block wow fadeInLeft" data-wow-delay=".3s" data-wow-duration="500ms">
<h2>
ABOUT THE COMPANY
</h2>
<p>
Persistent Systems is a technology services company which was incorporated on 16 May 1990 as Persistent Systems Private Limited. It was subsequently converted into a public Limited company on 17 September 2010 with the name Persistent Systems Limited and a new certificate of incorporation was issued on 28 September 2007 from the RoC.
</p>
</div>
</div>
<div class="col-md-6 col-sm-6">
<div class="block wow fadeInRight" data-wow-delay=".3s" data-wow-duration="500ms">
<img src="images/about/about.jpg" alt="">
</div>
</div>
</div>
</div>
</section> <!-- /#about -->
<!--
==================================================
Portfolio Section Start
================================================== -->
<section id="works" class="works">
<div class="container">
<div class="section-heading">
<h1 class="title wow fadeInDown" data-wow-delay=".3s">Available Programmes</h1>
<p class="wow fadeInDown" data-wow-delay=".5s">
The following programmes are available for our employees..
</p>
</div>
<div class="row">
<div class="col-sm-4 col-xs-12">
<figure class="wow fadeInLeft animated portfolio-item" data-wow-duration="500ms" data-wow-delay="0ms">
<div class="img-wrapper">
<img src="images/portfolio/item-1.jpg" class="img-responsive" alt="this is a title" >
<div class="overlay">
<div class="buttons">
<a target="_blank" href="service.html">Enroll for Selenium</a>
</div>
</div>
</div>
<figcaption>
<h4>
<a href="#">
Selenium
</a>
</h4>
<p>
Automated software testing tool
</p>
</figcaption>
</figure>
</div>
<div class="col-sm-4 col-xs-12">
<figure class="wow fadeInLeft animated" data-wow-duration="500ms" data-wow-delay="300ms">
<div class="img-wrapper">
<img src="images/portfolio/item-2.jpg" class="img-responsive" alt="this is a title" >
<div class="overlay">
<div class="buttons">
<a target="_blank" href="service.html">Enroll for Robotium</a>
</div>
</div>
</div>
<figcaption>
<h4>
<a href="#">
Robotium
</a>
</h4>
<p>
Automation testing framework (Android) </p>
</figcaption>
</figure>
</div>
<div class="col-sm-4 col-xs-12">
<figure class="wow fadeInLeft animated" data-wow-duration="500ms" data-wow-delay="300ms">
<div class="img-wrapper">
<img src="images/portfolio/item-3.jpg" class="img-responsive" alt="" >
<div class="overlay">
<div class="buttons">
<a target="_blank" href="service.html">Enroll for TestComplete</a>
</div>
</div>
</div>
<figcaption>
<h4>
<a href="#">
TestComplete
</a>
</h4>
<p>
Open testing platform
</p>
</figcaption>
</figure>
</div>
<div class="col-sm-4 col-xs-12">
<figure class="wow fadeInLeft animated" data-wow-duration="500ms" data-wow-delay="600ms">
<div class="img-wrapper">
<img src="images/portfolio/item-4.jpg" class="img-responsive" alt="" >
<div class="overlay">
<div class="buttons">
<a target="_blank" href="service.html">Enroll for SoapUI</a>
</div>
</div>
</div>
<figcaption>
<h4>
<a href="#">
SoapUI
</a>
</h4>
<p>
Web service testing application
</p>
</figcaption>
</figure>
</div>
<div class="col-sm-4 col-xs-12">
<figure class="wow fadeInLeft animated" data-wow-duration="500ms" data-wow-delay="900ms">
<div class="img-wrapper">
<img src="images/portfolio/item-5.jpg" class="img-responsive" alt="" >
<div class="overlay">
<div class="buttons">
<a target="_blank" href="service.html">Enroll for QTP(HP)</a>
</div>
</div>
</div>
<figcaption>
<h4>
<a href="#">
QTP
</a>
</h4>
<p>
Automated functional testing tool
</p>
</figcaption>
</figure>
</div>
<div class="col-sm-4 col-xs-12">
<figure class="wow fadeInLeft animated" data-wow-duration="500ms" data-wow-delay="1200ms">
<div class="img-wrapper">
<img src="images/portfolio/item-6.jpg" class="img-responsive" alt="" >
<div class="overlay">
<div class="buttons">
<a target="_blank" href="service.html">Enroll for TestDrive</a>
</div>
</div>
</div>
<figcaption>
<h4>
<a href="#">
TestDrive
</a>
</h4>
<p>
Automated software quality solution
</p>
</figcaption>
</figure>
</div>
</div>
</div>
</section> <!-- #works -->
<!--
==================================================
Portfolio Section Start
================================================== -->
<section id="feature">
<div class="container">
<div class="section-heading">
<h1 class="title wow fadeInDown" data-wow-delay=".3s">BENEFITS</h1>
<p class="wow fadeInDown" data-wow-delay=".5s">
The benefits of the programme are clearly very high.<br>The programme empowers you with new ways for quality software development.
</p>
</div>
<div class="row">
<div class="col-md-4 col-lg-4 col-xs-12">
<div class="media wow fadeInUp animated" data-wow-duration="500ms" data-wow-delay="300ms">
<div class="media-left">
<div class="icon">
<i class="ion-ios-flask-outline"></i>
</div>
</div>
<div class="media-body">
<h4 class="media-heading">Better product quality
</h4>
<p>After the programme,the products you generate will see a rise in quality.</p>
</div>
</div>
</div>
<div class="col-md-4 col-lg-4 col-xs-12">
<div class="media wow fadeInDown animated" data-wow-duration="500ms" data-wow-delay="600ms">
<div class="media-left">
<div class="icon">
<i class="ion-ios-lightbulb-outline"></i>
</div>
</div>
<div class="media-body">
<h4 class="media-heading">Client satisfaction
</h4>
<p>Better quality products will automatically lead to better client satisfaction</p>
</div>
</div>
</div>
<div class="col-md-4 col-lg-4 col-xs-12">
<div class="media wow fadeInDown animated" data-wow-duration="500ms" data-wow-delay="900ms">
<div class="media-left">
<div class="icon">
<i class="ion-ios-lightbulb-outline"></i>
</div>
</div>
<div class="media-body">
<h4 class="media-heading">Work reduction
</h4>
<p>The programme will allow you to generate products in a complete new mannner thus reducing your work.</p>
</div>
</div>
</div>
<div class="col-md-4 col-lg-4 col-xs-12">
<div class="media wow fadeInDown animated" data-wow-duration="500ms" data-wow-delay="1200ms">
<div class="media-left">
<div class="icon">
<i class="ion-ios-americanfootball-outline"></i>
</div>
</div>
<div class="media-body">
<h4 class="media-heading">Easier development
</h4>
<p>Development of new products will now be easier than ever before.</p>
</div>
</div>
</div>
<div class="col-md-4 col-lg-4 col-xs-12">
<div class="media wow fadeInDown animated" data-wow-duration="500ms" data-wow-delay="1500ms">
<div class="media-left">
<div class="icon">
<i class="ion-ios-keypad-outline"></i>
</div>
</div>
<div class="media-body">
<h4 class="media-heading">Increased work rate
</h4>
<p>New methods will allow you to work at a faster pace thus increasing your work rate.</p>
</div>
</div>
</div>
<div class="col-md-4 col-lg-4 col-xs-12">
<div class="media wow fadeInDown animated" data-wow-duration="500ms" data-wow-delay="1800ms">
<div class="media-left">
<div class="icon">
<i class="ion-ios-barcode-outline"></i>
</div>
</div>
<div class="media-body">
<h4 class="media-heading">Skill upgradation</h4>
<p>Last but not the least,you will have a new set of skills completely industry relevant.</p>
</div>
</div>
</div>
</div>
</div>
</section> <!-- /#feature -->
<!--
==================================================
Call To Action Section Start
================================================== -->
<section id="call-to-action">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="block">
<h2 class="title wow fadeInDown" data-wow-delay=".3s" data-wow-duration="500ms">STILL THINKING?</h1>
<p class="wow fadeInDown" data-wow-delay=".5s" data-wow-duration="500ms">Stop thinking. Begin now. The later you begin, the more you will be left behind.</p>
Contact With Me
</div>
</div>
</div>
</div>
</section>
<!--
==================================================
Footer Section Start
================================================== -->
<footer id="footer">
<div class="container">
<div class="col-md-8">
<p class="copyright">Copyright: <span>2015</span> . `enter code here`Design and Developed by Themefisher</p>
</div>
<div class="col-md-4">
<!-- Social Media -->
<ul class="social">
<li>
<a href="https://www.facebook.com/PersistentSystems/" target="_blank"class="Facebook">
<i class="ion-social-facebook"></i>
</a>
</li>
<li>
<a href="https://twitter.com/Persistentsys?ref_src=twsrc%5Egoogle%7Ctwcamp%5Eserp%7Ctwgr%5Eauthor" target="_blank" class="Twitter">
<i class="ion-social-twitter"></i>
</a>
</li>
<li>
<a href="https://www.linkedin.com/company/persistent-systems" class="Linkedin" target="_blank">
<i class="ion-social-linkedin"></i>
</a>
</li>
</ul>
</div>
</div>
</footer> <!-- /#footer -->
</body>
</html>
I am currently working on a web project where if the user wants to enroll for a particular program the user clicks on enroll and they are redirected to the log in page. but I want that they should be automatically redirected to their profile pages if they are already logged in.What should I do.Also I am a newbie to stackoverflow so I don't know how to present my code here.If someone would tell me how to do so I am totally open to do it.
You have to test in PHP if your user is logged into your website.
session_start();
if(isset($_SESSION['isLogged'])){
header('Location: profil.php');
exit;
}
else {
header('Location: login.php');
exit;
}
I suppose you don't know a lot PHP, so you should have a look to how create a membership and use PHP sessions :-)
https://code.tutsplus.com/tutorials/user-membership-with-php--net-1523
well you need to check your if session or if cookie exists and is not expired .... if they exist then you redirect before the whole page is loaded (server Logic) ... as i dont know what language you have written you server logic in i cant help you with the code
After user is logged-in generate a user token and store it in a cookie when ever user redirect to login-page use jquery/javascript to check the cookie then from there you can decide whether user should stay in login-page or redirect to profile page.
You can post your code by pasting in the editor and select the code then click on {} this symbol
I am trying on bootstrap with some new thing I am trying to make navigation bar responsive for that I want my list should appear on navigation bar o=for med or large screen and as a button in for extra small screen devices as toggle button but for me even for large screen it is showing toggle button
Here is my piece of code for that
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE-edge">
<meta name="viewport" content="wdth=device-width,intial-scale=1">
<title>Ristorante Con Fusion</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-theme.min.css" rel="stylesheet">
<link href="css/mystyle.css" rel="stylesheet">
</head>
<body>
<nav class="navbar navbar-inverse navbar-static-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggled-collapsed hide-sm-up" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
Restorante con fusion
</div>
<div id="navbar" class="navbar-collapse collapse navbar-right">
<ul class="nav navbar-nav">
<li class="active">Home</li>
<li>About</li>
<li>Menu</li>
<li>Contact</li>
</ul>
</div>
</div>
</nav>
<header class="jumbotron">
<!-- Main component for a primary marketing message or call to action -->
<div class="container">
<div class="row row-header">
<div class="col-xs-12 col-sm-8">
<h1>Ristorante con Fusion</h1>
<p style="padding:40px;"></p>
<p>We take inspiration from the World's best cuisines, and create a unique fusion experience. Our lipsmacking creations will tickle your culinary senses!</p>
</div>
<div class="col-xs-12 col-sm-4">
</div>
</div>
</div>
</header>
<div class="container">
<div class="row">
<div class="row row-content">
<div class="col-xs-12 col-sm-3 col-sm-push-9">
<p style="padding:20px;"></p>
<h3 align=center>Our Lipsmacking Culinary Creations</h3>
</div>
<div class="col-xs-12 col-sm-9 col-sm-pull-3">
<h2>Uthappizza</h2>
<p>A unique combination of Indian Uthappam (pancake) and Italian pizza, topped with Cerignola olives, ripe vine cherry tomatoes, Vidalia onion, Guntur chillies and Buffalo Paneer.</p>
<p>More »</p>
</div>
</div>
<div class="row row-content">
<div class="col-xs-12 col-sm-3 col-sm-push-9">
<p style="padding:20px;"></p>
<h3 align=center>This Month's Promotions</h3>
</div>
<div class="col-xs-12 col-sm-9 col-sm-pull-3">
<h2>Weekend Grand Buffet</h2>
<p>Featuring mouthwatering combinations with a choice of five different salads, six enticing appetizers, six main entrees and five choicest desserts. Free flowing bubbly and soft drinks. All for just $19.99 per person </p>
<p>More »</p>
</div>
</div>
<div class="row row-content">
<div class="col-xs-12 col-sm-3 col-sm-push-9">
<p style="padding:20px;"></p>
<h3 align=center>Meet our Culinary Specialists</h3>
</div>
<div class="col-xs-12 col-sm-9 col-sm-pull-3">
<h2>Alberto Somayya</h2>
<h4>Executive Chef</h4>
<p>Award winning three-star Michelin chef with wide International experience having worked closely with whos-who in the culinary world, he specializes in creating mouthwatering Indo-Italian fusion experiences. </p>
<p>More »</p>
</div>
</div>
</div>
</div>
<footer>
<div class="container">
<div class="row row-footer">
<div class="col-xs-5 col-xs-offset-1 col-sm-2 col-sm-offset-1">
<h5>Links</h5>
<ul class="list-unstyled">
<li>Home</li>
<li>About</li>
<li>Menu</li>
<li>Contact</li>
</ul>
</div>
<div class="col-xs-6 col-sm-5">
<h5>Our Address</h5>
<address>
121, Clear Water Bay Road<br>
Clear Water Bay, Kowloon<br>
HONG KONG<br>
Tel.: +852 1234 5678<br>
Fax: +852 8765 4321<br>
Email: confusion#food.net
</address>
</div>
<div class="col-xs-12 col-sm-4">
<div style="padding: 40px 10px;">
Google+
Facebook
LinkedIn
Twitter
YouTube
Mail
</div>
</div>
<div class="col-xs-12 col-sm-12">
<p style="padding:10px;"></p>
<p align=center>© Copyright 2015 Ristorante Con Fusion</p>
</div>
</div>
</div>
</footer>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
Please help me out here.I tried that code in EDGE and chrome
According to the Official Bootstrap Documentation.
Easy fix just replace hide-sm-up (which isn't even a bootstrap class) with visible-xs-block.
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery.min.js"></script>
<script src="http://getbootstrap.com/dist/js/bootstrap.js"></script>
<link rel="stylesheet" href="http://getbootstrap.com/dist/css/bootstrap.css"/>
</head>
<body>
<nav class="navbar navbar-inverse navbar-static-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggled-collapsed visible-xs-block pull-right" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
Restorante con fusion
</div>
<div id="navbar" class="navbar-collapse collapse navbar-right">
<ul class="nav navbar-nav">
<li class="active">Home</li>
<li>About</li>
<li>Menu</li>
<li>Contact</li>
</ul>
</div>
</div>
</nav>
<header class="jumbotron">
<!-- Main component for a primary marketing message or call to action -->
<div class="container">
<div class="row row-header">
<div class="col-xs-12 col-sm-8">
<h1>Ristorante con Fusion</h1>
<p style="padding:40px;"></p>
<p>We take inspiration from the World's best cuisines, and create a unique fusion experience. Our lipsmacking creations will tickle your culinary senses!</p>
</div>
<div class="col-xs-12 col-sm-4">
</div>
</div>
</div>
</header>
<div class="container">
<div class="row">
<div class="row row-content">
<div class="col-xs-12 col-sm-3 col-sm-push-9">
<p style="padding:20px;"></p>
<h3 align=center>Our Lipsmacking Culinary Creations</h3>
</div>
<div class="col-xs-12 col-sm-9 col-sm-pull-3">
<h2>Uthappizza</h2>
<p>A unique combination of Indian Uthappam (pancake) and Italian pizza, topped with Cerignola olives, ripe vine cherry tomatoes, Vidalia onion, Guntur chillies and Buffalo Paneer.</p>
<p>More »</p>
</div>
</div>
<div class="row row-content">
<div class="col-xs-12 col-sm-3 col-sm-push-9">
<p style="padding:20px;"></p>
<h3 align=center>This Month's Promotions</h3>
</div>
<div class="col-xs-12 col-sm-9 col-sm-pull-3">
<h2>Weekend Grand Buffet</h2>
<p>Featuring mouthwatering combinations with a choice of five different salads, six enticing appetizers, six main entrees and five choicest desserts. Free flowing bubbly and soft drinks. All for just $19.99 per person </p>
<p>More »</p>
</div>
</div>
<div class="row row-content">
<div class="col-xs-12 col-sm-3 col-sm-push-9">
<p style="padding:20px;"></p>
<h3 align=center>Meet our Culinary Specialists</h3>
</div>
<div class="col-xs-12 col-sm-9 col-sm-pull-3">
<h2>Alberto Somayya</h2>
<h4>Executive Chef</h4>
<p>Award winning three-star Michelin chef with wide International experience having worked closely with whos-who in the culinary world, he specializes in creating mouthwatering Indo-Italian fusion experiences. </p>
<p>More »</p>
</div>
</div>
</div>
</div>
<footer>
<div class="container">
<div class="row row-footer">
<div class="col-xs-5 col-xs-offset-1 col-sm-2 col-sm-offset-1">
<h5>Links</h5>
<ul class="list-unstyled">
<li>Home</li>
<li>About</li>
<li>Menu</li>
<li>Contact</li>
</ul>
</div>
<div class="col-xs-6 col-sm-5">
<h5>Our Address</h5>
<address>
121, Clear Water Bay Road<br>
Clear Water Bay, Kowloon<br>
HONG KONG<br>
Tel.: +852 1234 5678<br>
Fax: +852 8765 4321<br>
Email: confusion#food.net
</address>
</div>
<div class="col-xs-12 col-sm-4">
<div style="padding: 40px 10px;">
Google+
Facebook
LinkedIn
Twitter
YouTube
Mail
</div>
</div>
<div class="col-xs-12 col-sm-12">
<p style="padding:10px;"></p>
<p align=center>© Copyright 2015 Ristorante Con Fusion</p>
</div>
</div>
</div>
</footer>
</body>
</html>
The title means what it says. when i setup a link to jump to a certain div it doesn't work. For example when i say <a href="#Section1>Section 1</a> and click it, it should jump to the anchor tag with the name of 'Section1' <a name="Section1"></> but nothing happens.
<main id="Main">
<div class="Container">
<div class="Section-Links Left Box-Sizing">
<div class="Links">
Test Post
Test Post
Test Post
Test Post
Test Post
Test Post
Test Post
Test Post
Test Post
Test Post
</div>
</div>
<div class="Sections Left Box-Sizing">
<div class="Section">
<a name="Test"></a>
<span class="Section-Title">Test Section</span>
<p class="Section-Text">Some Random Words Here.</p>
</div>
<div class="Section">
<a name="Test2"></a>
<span class="Section-Title">Test Section</span>
<p class="Section-Text">Some Random Words Here.</p>
</div>
<div class="Section">
<a name="Test3"></a>
<span class="Section-Title">Test Section</span>
<p class="Section-Text">Some Random Words Here.</p>
</div>
<div class="Section">
<a name="Test4"></a>
<span class="Section-Title">Test Section</span>
<p class="Section-Text">Some Random Words Here.</p>
</div>
<div class="Section">
<a name="Test5"></a>
<span class="Section-Title">Test Section</span>
<p class="Section-Text">Some Random Words Here.</p>
</div>
<div class="Section">
<a name="Test6"></a>
<span class="Section-Title">Test Section</span>
<p class="Section-Text">Some Random Words Here.</p>
</div>
<div class="Section">
<a name="Test7"></a>
<span class="Section-Title">Test Section</span>
<p class="Section-Text">Some Random Words Here.</p>
</div>
<div class="Section">
<a name="Test8"></a>
<span class="Section-Title">Test Section</span>
<p class="Section-Text">Some Random Words Here.</p>
</div>
<div class="Section">
<a name="Test9"></a>
<span class="Section-Title">Test Section</span>
<p class="Section-Text">Some Random Words Here.</p>
</div>
<div class="Section">
<a name="Test10"></a>
<span class="Section-Title">Test Section</span>
<p class="Section-Text">Some Random Words Here.</p>
</div>
</div>
<div class="Clear"></div>
</div>
<p class="Footer-Masthead">Created By Moussa Harajli.</p>
</main>
if you would like to test this go here. http://67.184.73.19/Projects/Assassins/rules.php
Anchor links doesn't point to names but to ids
so change for example:
<a name="Test7"></a>
to:
<a id="Test7"></a>
And you should not change the capitalization of the ids in the id attribute and the links.
Try setting the id in the div tag:
<div id="test" class="Section">...</div>
And this should work:
Test Post
The reason behind your problem is that you have different ID's in your links since test2 is not the same as Test2.
Though... from my experience the <a> element is essentially redundant since the following works in all modern browsers:
<main id="Main">
<div class="Container">
<div class="Section-Links Left Box-Sizing">
<div class="Links">
Test Post
Test Post
</div>
</div>
<div class="Sections Left Box-Sizing">
<div id="test" class="Section">
<span class="Section-Title">Test Section</span>
<p class="Section-Text">Some Random Words Here.</p>
</div>
<div id="test2" class="Section">
<span class="Section-Title">Test Section</span>
<p class="Section-Text">Some Random Words Here.</p>
</div>