Columns Within Border

Support
#1

I’m trying to have a solid border around a section of text. It works fine throughout my page, unless the text is broken into columns. As soon as I break the text into columns, the border changes size and no longer surrounds the entire DIV.

These are individual blog posts I’m referring to, so they can’t be built in cornerstone.

This is an example of what I’m trying to do (the bottom two sections):
http://theseforeignroads.com/_test-items/

#2

Hello There,

Thanks for posting in a very detailed information. Your border collapsed because you have implemented the columns incorrectly. You must have a row container first before you can display a column. Please have your code updated and use this one instead:

<div align="center" class="textbox">
  
  <div class="x-container">

    <div class="x-column x-sm x-1-2" style="">
      <p><a href="#colombiamust">Must Visit Destinations</a></p>
      <p><a href="#colombiaunique">Unique Experiences</a></p>
      <p><a href="#colombialesser">Lesser-Visited Destinations</a></p>
      <p><a href="#colombiaonething">If you Only do One Thing</a></p>
      <p><a href="#colombiafood">Colombian Food</a></p>
      <p><a href="#colombiagbu">The Good, the Bad, the Ugly</a></p>
      <p><a href="#colombiacosts">Costs of Travel</a></p>
    </div>

    <div class="x-column x-sm x-1-2 last" style="">
      <p><a href="#colombiamoney">Money</a></p>
      <p><a href="#colombiavisa">Visa Requirements</a></p>
      <p><a href="#colombiagetaround">Getting Around</a></p>
      <p><a href="#colombiaaccom">Accommodation</a></p>
      <p><a href="#colombialanguage">Language</a></p>
      <p><a href="#colombiaweather">Weather and Climate&lt;</a></p>
      <p><a href="#colombiahealth">Health and Safety</a></p>
    </div>

  </div>
  
</div>

We would loved to know if this has work for you. Thank you.

#3

Ah! This worked amazingly, thank you!

Not only for this, but everywhere else I’ve had columns, it greatly improves functionality!

#4

You’re welcome. Glad we could help.

#5

@christian_y Sorry, one more question regarding the columns. How would I change this code to have three or four columns?

Thanks

#6

You can change the x-1-2 to x-1-3 or x-1-4

Hope that helps.

#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.