Support » Themes and Templates » How do I create a border inside of a post?

Viewing 2 replies - 1 through 2 (of 2 total)
  • Well, you could add this html using the html editor (instead of the visual editor)

    <div class="video_callout">
        <div class="callout_text">
        <span class="label">Video Duration</span>
        <span class="duration">60 Minutes</span>
        </div>
        <div class="callout_image">
        <img src="http://www.mysite.com/image.jpg">
        </div>
    </div>

    And then style it with css such as this

    .video_callout {
    height:150px;
    width:300px;
    border-top:3px solid black;
    border-bottom:3px solid black;
    }
    .callout_text {
    width:50%;
    text-align:center;
    }
    .callout_image {
    width:50%;
    }
    .callout_text span.label {
    font-style:italic;
    color:black;
    }
    .callout_text span.duration {
    color:red;
    }

    Thank you for the response, Kyle!

    I implemented the above directions but unfortunately the outcome was not that good 🙁

    It looks like this now:
    http://img716.imageshack.us/img716/2823/newlb.jpg

    Here’s my css code:

    .video_callout {
    height:150px;
    border-top:3px solid;
    border-bottom:3px solid;
    border-color: #b2b2b2;
    }
    .callout_text {
    width:50%;
    text-align:left;
    }
    .callout_image {
    width:100%;
    text-align:right;
    }
    .callout_text span.label {
    font-style:italic;
    font-size:40px;
    color:black;
    }
    .callout_text span.duration {
    color:red;
    font-size:40px
    }

    Any ideas!?

    Thanks so much!

    UPDATE: I fixed it (for the most part) using float:left on text and float:right on image – thank you!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘How do I create a border inside of a post?’ is closed to new replies.