0

EDITED

Here's my updated question: I've included a link to my site which shows the exact problem here The first box has a title that is short, and therefore doesn't push the the two divs beneath it (location and price) down very far. The second box has a slightly longer title, so it pushes slightly more. The third box has the longest title and pushes more than box 1 and 2.

In this instance, I'd want box #1 and #2 to have "blank space" padded onto their title divs in order to push the location/price divs down lower (like in box #3). This needs to be dynamic, because sometimes box #1 will have the longest title. I thought blank characters might work but apparently not...

Thanks for any help!

BELOW THIS LINE IS OLD My site has a list item which contains an image, and 3 divs (titlebox,locationbox, and pricebox).

The line I'm interested in is titlebox, mainly I'd like like it to always have 40 characters in it. If there's less, I need blank padding added.

I'll post the entire list code below, but here is just the title div:

<div class="titlebox">Exceptional House with a View</div>

This title only has 29 characters, but I want it to be treated as if it has 40. I don't care if there's more than 40, I only need a function to pad the text with blank space until 40 characters.

How is this possible? Thank you!

Here is the entire list item:

<li class="list__item">
            <figure class="list__item__inner">
            <a class="divLink" href="http://www.testsite.com/BEE/info.html">
             <p class="vignette" style="background-image:url(http://www.fakesite.com/image2.jpg)"></p>
             <div class="titlebox">Exceptional House with a View</div>
       <div class="locationbox">BorrisVille</div>
     <div class="pricebox">Asking $349,000</div>
     </a>
</li>
4

1 回答 1

0

您是否考虑使用 CSS 最小宽度？

<div style="min-width: 200px;"></div>

要回答您的问题，您还可以在 Javascript/jQuery 中创建一个方法，但这看起来/感觉很草率：

function maxOut() {
        var spacesNeeded = 40 - $('#myDiv').html().length;
        var spacer = '';
        for (var i = 0; i < spacesNeeded; i++) {
            spacer += '&nbsp;';
        }
        $('#myDiv').append(spacer);
    }
于 2015-01-14T20:09:10.650 回答