jquery – 如何在我的内容的左下角设置浮动div？

我希望能够在我的内容的左下角放置一个div(就像这个线框上的div n°2).

诀窍是我想这样做而不必在“内容”div中手动插入它.

(上下文：我有超过500个wordpress帖子,我想这样做,手动插入解决方案似乎很痛苦,最近似乎是近似的).

我尝试使用position：absolute; bottom：0px;但如果我这样做,div 2就会在我的内容之上,并掩盖我的一些文字内容.

关于如何将div2的底部与我内容的确切底部对齐的任何线索？还有Jquery吗？

这是我的HTML代码的概述.

<div class="contenu">
    <div id="1"><img class="ad_300x250" style="float:left; margin:0 10px 0 0;" src="300x250_3.jpg" /></div>
    <div id="2"><img class="ad_300x250" src="300x250_3.jpg" /></div>
    <p>Loin,très loin,au delà des monts Mots,à mille lieues des pays Voyellie et Consonnia,demeurent les Bolos Bolos. Ils vivent en retrait,à Bourg-en-Lettres,sur les côtes de la Sémantique,un vaste océan de langues.</p>
            <p>Un petit ruisseau,du nom de Larousse,coule en leur lieu et les approvisionne en règlalades nécessaires en tout genre; un pays paradisiagmatique,dans lequel des pans entiers de phrases prémâchées vous volent litéralement tout cuit dans la bouche. Pas même la toute puissante Ponctuation ne régit les Bolos Bolos - une vie on ne peut moins orthodoxographique.</p>
            <h2>Titre 2 </h2>
            <p>Un jour pourtant,une petite ligne de Bolo Bolo du nom de Lorem Ipsum décida de s'aventurer dans la vaste Grammaire.</p>
            <h3>Titre 3 </h3>
            <p>Le grand Oxymore voulut l'en dissuader,le prevenant que là-bas cela fourmillait de vils Virgulos,de sauvages </p>
            <h2>Titre 2 </h2>
            <p>Pointdexclamators et de sournois Semicolons qui l'attendraient pour sûr au prochain paragraphe,mais ces mots ne firent écho dans </p>
            <ul>
                <li>
                    l'oreille du petit Bolo
                </li>
                <li>
                    qui ne se laissa point déconcerter.
                </li>
                <li>
                    Il pacqua ses 12 lettrines,glissa son initiale dans sa panse et se mit en route.
                </li>
            </ul>
            <p>Alors qu'il avait gravi les premiers flancs de la chaîne des monts Italiques,il jeta un dernier regard sur la skyline de Bourg-en-Lettres,sa ville alphanatale,la headline d'Alphabetville,la subline de sa propre rue,le passage Motus. Le coeur lourd et nostalgique,une question rhétorique lui coula le long de la joue,puis,il se remit en route. </p>
            <p>En chemin,il rencontra un copy. Le copy prévint le petit Bolo que là d'où il venait,il avait déjà maintes et maintes fois été ressaisi,et que tout ce qui désormais restait de leurs origines était le mot "et",et que le petit Bolo ferait bien de se raviser,rebrousser chemin et retourner en son sain et sauf bercail. Mais toutes bonnes</p>

            <p>Alors qu'il avait gravi les premiers flancs de la cha&icirc;ne des monts Italiques,une question rh&eacute;torique lui coula le long de la joue,il se remit en route.</p>
        </div>

解决方法

修复CSS规则

定位您的评论：

`context : I have more than 500 wordpress posts where i’d like to do
that,and the manual insert solution seems painful and approximative
at best

您可以组合一个伪元素和一个nth-child选择器(请检查完整的浏览器支持)

只有固定的夹具是一个非常大的结束段落将你的浮动从底部放置一条或多条线.我想这不是一个大问题.

无论如何,使用这个伪你将能够找到你的第二个div与css忘记标记.
您可以使用img标记或背景来显示图像
我说：在此之前,图像将被最后一段的文字包裹起来.
在我的例子中,我使用了颜色背景和固定大小来查看伪元素

.contenu p:nth-last-child(1):before {
    content:" ";   /* Or the image */
    display:block;
    width:200px;
    height:100px;
    background:#ff0000;  /* or the image */
    float:left;

}

看一个小提琴here
当然不再需要div id =“2”.

顺便说一下：并非所有的解析器都会对以数字开头的id感到满意！