CODEWITHSUNDEEP
htmlcss
TheJoker
TheJoker

Reputation: 51

Trying to place list using li to the left with css

I am trying to place the li to the left. When I use float:right; it removes the Background color, and it gets ugly Please help me to place the li to the left?

html:

<div class="internallinks2">                  
                          <h2>More categories</h2>

                        <ul id="MoreCategoriesUL">
                          <li class="MoreCategoriesLI">
                            <i class="fas fa-table-tennis"></i>
                            <a href="HowTo_computes_cat.html"style="padding:10px; 
                            width:20px;">Entertainment</a>
                            <br>
                          </li>

                        </ul>
</div>

css:

.internallinks2 {
  margin-top: -5px;
  text-align: center;
  color: #767676;
  background-color: #f6f5f4;
  cursor: pointer;
  margin-right: 80px;
  width: 250px;
  border-radius: 10px;
}
#MoreCategoriesUL {
  list-style: none;
  margin-left: 0;
}
#MoreCategoriesUL li {
  clear: both;
  list-style-image: none;
  float: left;
}

Upvotes: 1

Views: 127

Answers (2)

Shahryar Mohajer
Shahryar Mohajer

Reputation: 589

this is put li to left with margin and padding 

     #MoreCategoriesUL {
            list-style: none;
            margin-left: 0;
            padding-left: 0;
        }

     #MoreCategoriesUL li {
            list-style-image: none;
            float: left;
            background: red;
            display: block;
            margin: 5px;
            padding: 10px;
        }

    #MoreCategoriesUL:after {
    content: '';
    display: block;
    clear: both;
    }

Upvotes: 1

Saptarshi
Saptarshi

Reputation: 148

You may use 

.internallinks2 {
  z-index: 99;
  /* Other CSS Attributes */
}

I'm not sure since I can't visualize the problem, but this may help.

Upvotes: 0

Related Questions