• So I am attempting to list all of the areas we serve in my sidebar but the list is rather long. I would like to create this as a two column list so that it does not stretch the length of my page so much. Does anyone have a snippet for this?

    I have put the list in and an example of it can be found here:
    https://asjrestoration.com/about/

    It is in the left sidebar. Any help is much appreciated!

Viewing 11 replies - 1 through 11 (of 11 total)
  • If you use the Text widget, you can add any HTML. So as the Theme is built around Twitter Bootstrap then something like this should work:

    <div class="row-fluid">
     <div class="span6 areas">
       <p>Area 1</p>
      </div>
     <div class="span6 areas">
       <p>Area 2</p>
      </div>
     <div class="span6 areas">
       <p>Area 3</p>
      </div>
     <div class="span6 areas">
       <p>Area 4</p>
      </div>
     <div class="span6 areas">
       <p>Area 5</p>
      </div>
    ..and so on
    </div>

    The span6 will place 2 Areas in every row.

    @electricfeet just reminded me about this snippet from Nic which might help

    Thread Starter msmith3184

    (@msmith3184)

    I tried that and it worked for the very first row but then it stopped working….Could it have something to do with me placing it in the sidebar instead of a post?

    I would actually make to separate lists with the state as a title, that way you could take the state off the LI and it would space better.

    #text-5 ul {
        margin: 0;
    }
    
    #text-5 ul li {
        width: 50%;
        float: left;
    }

    Sorry, double posted.

    Thread Starter msmith3184

    (@msmith3184)

    @batharoy Ok you lost me with the CSS there. I am starting to pick up on a little more css stuff but I am still very much a novice. @rdellconsulting I tried using the code you suggested above as well as the snippet you sent. Got some weird results….if you wouldn’t mind taking a look and letting me know where I went wrong, I would really appreciate it!
    https://asjrestoration.com/services/

    Thanks!

    I don’t think rdell read that it was in the sidebar. Your dealing with an area that is only span-3 to start with. Using span-6 or what is in the snippet wont really help.

    Copy & paste my code to the custom css area to see if that is the effect you want.

    Thread Starter msmith3184

    (@msmith3184)

    @batharoy that worked great for creating the two columns but now the responsive is off….Placing the sidebars above the content when shrunk down to mobile devices….Any ideas why? Thanks again for your help on this!

    I believe that’s the default action with 2 sidebars. It does the same on my test server.

    Thread Starter msmith3184

    (@msmith3184)

    gotcha…Well thanks for all of your help on this and I think I got exactly what I was looking for! Your guys rock!

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘Creating a two column ul in sidebar’ is closed to new replies.