I'm new to HTML so I don't really know much, but how do you put links on the same layer/line as different links? I put them as different classes, but I don't know if that's really the problem. Please help me put them in the same line/layer! I looked everywhere on Google and stack overflow, but it seems that I can't find an answer. My results were something like this:
link1 link2
, but i want it to be like this.
link1 link2
Please help! (Use CSS and HTML)
Answer
<a> tags by default are inline, meaning they naturally sit next to each other on the same line.
If you already have class you can use :
html :
<a class="link1" href="page1.html">Link 1</a>
<a class="link2" href="page2.html">Link 2</a>
css :
.link1, .link2 {
display: inline-block; /* or inline */
}
Or :
<style>
.nav-links a {
display: inline-block; /* or just use inline */
margin-right: 10px; /* spacing between links */
text-decoration: none; /* remove underline (optional) */
color: blue; /* color (optional) */
}
</style>
</head>
<body>
<div class="nav-links">
<a href="page1.html">Link 1</a>
<a href="page2.html">Link 2</a>
<a href="page3.html">Link 3</a>
</div>
