Text Links

3. CSS Navigation Bars

3.2. Horizontal Navigation Bars


          You have learned that to create vertical navigation bars, you make use of the display: block property-value pair to modify the appearance of the links. For horizontal navigation bars, one way is you only need to change the value of property to inline.

          The second way that you can implement horizontal navigation bars is by using the float property.


      ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
        background-color: rgb(42,157,143);
        overflow: hidden;
      }
      li{
        float: left;
      }
 

          Check out this link (https://bashooka.com/coding/36-css-link-style-hover-effect-examples/) for inspiration of link styles. Do not copy and paste. Use them only as a reference.