Align img inside nav tabs section

Joined
Aug 21, 2023
Messages
32
Reaction score
0
Hello,
I have images inside the nav tabs section. They are also hyperlinks . I want to align them to the right. I tried several times adding float:right or text-align: right but nothing happens. What can I do? This is part of my html an css:
HTML:
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Porfolio page </title>
    <!-- Bootstrap -->
    <link href="css/bootstrap-4.4.1.css" rel="stylesheet">
      <link href="style.css" type="text/css" rel="stylesheet">
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
      <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
    
  </head>
  <body>
      <!-- body code goes here -->
      <div class="container">
      <ul class="nav nav-tabs">
        <li class="nav-item"> <a class="nav-link" href="projects.html">Projects</a> </li>
        <li class="nav-item"> <a class="nav-link" href="about.html">About</a> </li>
        <li class="nav-item"> <a class="nav-link" href="contact.html">Contact</a> </li>
        <a href="index.html"><img src="images/AVI.svg" height="40px" id="logo"></a>
        <a href="---"><img src="images/facebook.svg" height="35px" id="facebook"></a>
        <a href="----"><img src="images/behance.svg" height="35px" id="behance"></a>
        <a href="---"><img src="images/soundcloud.svg" height="35px" id="soundcloud"></a>
        <a href="---"><img src="images/youtube.svg" height="35px" id="youtube"></a>
      </ul>
      </div>
    </body>
</html>

CSS:
@charset "UTF-8";
body {font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";}
#logo {margin-left: auto;margin-right: auto;margin-top: 5px;margin-bottom: 5px}
#facebook {margin-right: 9px;margin-top: 5px;margin-bottom: 5px}
#behance {margin-left: 9px;margin-right: 9px;margin-top: 5px;margin-bottom: 5px}
#soundcloud {margin-left: 9px;margin-right: 9px;margin-top: 5px;margin-bottom: 5px}
#youtube {margin-left: 10px;margin-top: 5px;margin-bottom: 5px;float: right;}
a :hover{color: greenyellow;cursor: pointer;text-decoration: none;}
a {color: black}
.main {display: block;}
article {margin-top: 20px;margin-left: 50px;margin-right: 50px;text-align: center;margin-bottom: 30px;}
.col-xl-4 {text-align: center;}
#footer {height: 40px;background-color: darkgray;text-align: center;padding: 9px;color: white;margin-top: 9px;}
#banner {margin-top: 9px;margin-bottom: 9px;}
 
Joined
Aug 22, 2023
Messages
41
Reaction score
7
Given that you would like to conduct precisely the same task with every anchor tag, I would suggest universally calling all anchor tags. A Javascript approach would be to conduct this statement: var lorem = document.getElementsByTagName("a");
lorem.style = float:right;
//test-align:right;
Whereas, a Cascading Style Sheets approach will obey unique syntax:
//tag selector
text-align:right;
Perhaps you simply encountered a formatting error.
 
Joined
Aug 21, 2023
Messages
32
Reaction score
0
Given that you would like to conduct precisely the same task with every anchor tag, I would suggest universally calling all anchor tags. A Javascript approach would be to conduct this statement: var lorem = document.getElementsByTagName("a");
lorem.style = float:right;
//test-align:right;
Whereas, a Cascading Style Sheets approach will obey unique syntax:
//tag selector
text-align:right;
Perhaps you simply encountered a formatting error.
This solution doesn't work for me.
 
Joined
Aug 21, 2023
Messages
32
Reaction score
0
Problem solved.
HTML:
//Part of code
<li class="logo"><a href="index.html"><img src="images/AVI.svg" height="40px"id="logo" alt="logo"></a></li>
and css:
CSS:
.logo {margin-left: auto;}
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,755
Messages
2,569,534
Members
45,008
Latest member
Rahul737

Latest Threads

Top