How to use link list horizontally in Blogger?

How to use link list horizontally in Blogger?

Hello everyone, do you want to use link list horizontally? if yes then you can continue to read. Today I will discuss about beautiful list link design for your blogger website or any html and CSS supported website.

Sometimes we want to show our list link horizontally . if you want to particular list link to show horizontally then you have to follow below steps.

if you want see demo how it looks then click on demo button below

Demo

first before doing any editing please backup your blogger template. because if you do any mistake then you can move on your previous design.

  • Now go to your blogger dashboard.
  • click on layout section
  • Now to click on add an gadget (where you want to show link list or menu bar )
  • copy below code carefully

<--start navbar code by sakshitrends.com-->

<style>
ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

li {
  float: left;
}

li a {
  display: block;
  padding: 8px;
  background-color: #dddddd;
}
</style>


<ul>
  <li><a href="#">Topic1</a></li>
  <li><a href="#">Topic2</a></li>
  <li><a href="#">Topic3</a></li>
  <li><a href="#">Topic4</a></li>
</ul><--end navbar code by sakshitrends.com-->

  • Paste this code where you want to show horizontal link list. 
  • Now you can edit yellow area text with your label or texts and you can use your links in place of #.

if you have any problem then you can comment below I will try to solve your problem. 


Next Post Previous Post
No Comment
Add Comment
comment url