Jump to content

Go48websites

Members
  • Posts

    1
  • Joined

  • Last visited

Everything posted by Go48websites

  1. I'm making a small site and it contains categories. I am trying to get these categorie containers all the same size but because the text in these container is not the same size, the container also varies in size. I tried giving each <li> a specific <div> but that didnt work out to well. This is the HTML (only contains the list) <div id="categoriemenu"> <div id="lifestyle"> <li><img src="categorielifestyle.jpg"><a href="#">LIFESTYLE</a></li></div> <div id="dieren"> <li><a href="#">DIEREN </a></li></div> <div id="electronica"> <li><a href="#">ELECTRONICA</a></li></div> <div id="informatica"> <li><a href="#">INFORMAICA</a></li></div> <div id="consument"> <li><a href="#">CONSUMENT</a></li></div> <div id="roddel"> <li><a href="#">RODDEL</a></li></div> <div id="motors"> <li><a href="#">MOTORS</a></li></div> <div id="autos"> <li><a href="#">AUTOS</a></li></div> </div> #categoriemenu li a:hover {color: #CCCCCC;background-color: #FFFFFF;}#categoriemenu li a {color: #000000;background-color: #FFFFFF; padding: 10px 75px 20px 75px;width: 100%;text-decoration: none; }#categoriemenu li {background-color: yellow;display: block; border: 5px solid #FFFFFF;text-decoration: none;padding: 200px 10px 50px 10px;margin: 10px 10px 10px 10px; float: left;}#categoriemenu li:hover {background-color: green;display: block; border: 5px solid #FFFFFF;text-decoration: none;padding: 200px 10px 50px 10px;margin: 10px 10px 10px 10px; float: left; I attached the full code for the site to the post also in case I forgot something. The image below is what I have now. As you can see it also says "IMG here in the middle" thats because of a smaller problem, where if I put the img in the <li> the image is not centered in the middle. But more like this: The colors of everything are purely there to make everything visible. A good example of what I would like to achieve is https://play.google.com/store the "popular games" "updated games" are all in containers the same sizes. I'm sorry for this long post, and I hope you can help me. Thanks in advance. PROcategorie.css PROcategoriekiezen.html
×
×
  • Create New...