We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 27451
    • 2 Posts
    Good morning!

    Im trying to set a width to my menu items. I gave it a width of 200px (just to try it out) but its not working!

    Anyone could give me a hint to the solution?

    Thanks!

    HTML:
    <ul id="menu">
       <li><a href="http://localhost/JEC/" title="Home" >Home</a></li>
    <li><a href="/JEC/index.php?id=4" title="Info" >Info</a></li>
    <li class="active"><a href="/JEC/index.php?id=7" title="Diensten" >Diensten</a></li>
    
    <li><a href="/JEC/index.php?id=8" title="Contact" >Contact</a></li>
    <li class="last"><a href="/JEC/index.php?id=9" title="Partners" >Partners</a></li>
    
    </ul>
    


    The wayfinder offcourse:
    <div class="navigatie">
    [[Wayfinder? &outerTpl=`Menu-ul` &rowTpl=`Menu-Li` &startId=`0` &level=`1`]]
        </div>


    And the css!
    ul li a:link{width: 200px;}
    
    ul#menu  {
    	width: 700px;
       
    }
    ul#menu  li {
      
       font-size: 16px;
    	 display: inline;
    	 width: 211px;
    }
    ul#menu  li a {
    	width: 211px;
    
    }
    ul#menu  li a:hover {
    width: 211px;
    }
    ul#menu  li a:active {
    width: 211px;
    }
    
    


      • 28042 ☆ A M B ☆
      • 24,524 Posts
      Neither li nor a elements are block elements, so they can’t have things like width, height, margin or padding.
        Studying MODX in the desert - http://sottwell.com
        Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
        Join the Slack Community - http://modx.org
        • 27451
        • 2 Posts
        Ah, thanks! didn’t thought about that!

        and thanks for the quick reply laugh!