Just starting out with website development and I have a question. As I practice making this website, I am struggling to figure out how to add the text "To know more about us click here" below the 'Get started' button. I tried adding a simple <a> tag after the buttons div but it doesn't seem to work. Here is what I want the final result to look like:
https://i.sstatic.net/TqAD9.png
If it helps, here is the entire website hosted on Netlify:
Here's the code:
import React from "react";
import web from "../src/images/myimage.svg";
import {NavLink} from "react-router-dom";
import Common from './Common';
import CarouselContainer from "./CarouselContainer";
import Aboutrefer from "./aboutrefer";
const Home = () => {
return (
<>
<CarouselContainer/>
<Common name ='Learn with' imgsrc={web} visit='/service' btnname='Get started' />
</>
);
};
export default Home;
Code of Common.js:
import React from "react";
import web from "../src/images/myimage.svg";
import {NavLink} from "react-router-dom";
const Common = (props) => {
return (
<>
<section id= "header" className= "d-flex align-items-between ">
<div className= "container-fluid">
<div className='row'>
<div className= "col-12 mx-auto">
<div className ="row">
<div className= "col-md-6 pt-5 pt-lg-0 order-2 order-lg-1 d-flex justify-content-center flex-column">
<h1>{props.name} <strong className= "brand-name"> Pinnacle Tutorials</strong>
</h1>
<h2 className= "my-3">
We are a team of talented Teachers here for your ward
</h2>
<div ClassName= "mt-3">
<NavLink to={props.visit} className= "btn btn-success">Get Started {props.btname}</NavLink>
</div>
</div>
<div className= "col-lg-6 order-6 order-lg-5 header-img d-flex justify-content-end">
<img src ={props.imgsrc} className= "img animated" alt= "home img "/>
</div>
</div>
</div>
</div>
</div>
</section>
);
};
export default Common;