put spaces between links

user_466534 0
Viewed 51275

I have two questions:

  1. When i run the code below, it shows me names of links in large form, after i reload, it is good, so what is problem?

  2. I want to put spaces between names like this:

მთავარი ბაკურიანი გუდაური ზღვა კახეთი სვანეთი ვარძია ქართლი ძველი_თბილისი

How could i do this?

<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  </head>
  <style>

    #links { 
      margin: 0 auto; 
      width: 3000px; 
      font-size:70px;
      clear: both; 
      display: block;
    }
    
    #test a {
      float: right;
    }
  </style>
  <body bgcolor="blue" >
    <a href="indexE.html"><img src ='english.gif' style="float:right"  width="88" height="88"> </a>
    <a href="indexR.html"><img src ='russian.gif' alt="Russian flag" style="float:right"  width="88" height="88"/>
    <a href="index.html"> <img src="georgian.jpg"  style="float:right" width="88" height="88"/>
    <div id="links">
      <a href=" index.html " >მთავარი </a>
      <a href=" ბაკურიანი.html ">ბაკურიანი </a>
      <a href=" გუდაური.html ">გუდაური </a>
      <a href=" ზღვა.html ">ზღვა </a>
      <a href=" კახეთი.html ">კახეთი </a>
      <a href=" სვანეთი.html ">სვანეთი </a>
      <a href=" ვარძია.html ">ვარძია </a>
      <a href=" ქართლი.html ">ქართლი </a>
      <a href=" ძველი_თბილისი.html ">ძველი_თბილისი </a>
    </div>
  </body>
</html>
html
9 Answers

Add padding in anchor tag CSS file.

Directly applies to all anchor tag:

ul li a{ padding: 10px; }

Or if using any class then,

.classname ul li a{ padding: 10px; }

user_101451620

Though &nbsp is totally valid but do try this as this is a elegant way

       <style>
       .links
       {
       display:flex;
       align-items:center;
      justify-content:space-around;
       }
      .links a
      {
      flex:1;
      text-align:center;
      }
       </style>

      <div class="links“>
        <a href=" კახეთი.html ">კახეთი </a>
      
       <a href=" სვანეთი.html ">სვანეთი </a>
       
       <a href=" ვარძია.html ">ვარძია </a>
      </div>
user_104974830

How to make space between exemple: Home About Contact

.menu{
      text-align: right; /*exemple*/
  }
  .menu1 {  
      list-style-type:  none;
        display: inline-flex;
    
    }


.test{
    color:red;
    text-decoration: none ;
    padding-inline-end: 55px; /*exemple */
    }
<div class="menu">
            <ul class="menu1">
              <li><a href="#location" class="test">Home</a></li>
              <li><a href="#location" class="test">About</a></li>
              <li><a href="#location" class="test">Contact</a></li>
            </ul>
        </div>

user_184028840
Related