vb.org Archive - Help with modifying quote code

vb.org Archive (https://vborg.vbsupport.ru/index.php)

- vB4 Programming Discussions (https://vborg.vbsupport.ru/forumdisplay.php?f=252)

- - Help with modifying quote code (https://vborg.vbsupport.ru/showthread.php?t=287480)

Help with modifying quote code

I'm trying to change around the way quotes are displayed. What I want is a top and bottom image that is aligned left and right respectively with the text wrapping around the images.

I got the left image wrapping ok but the right image is giving me trouble. Also, the left (and right) image seems to be having trouble with the padding css I put in. It does padding on the left of the image but not the bottom or right.

Here is the css:

Code:

.quote_left {

padding-left:20px;

}



.quote_right {

padding-right:20px;

}

and here is the main html for quotes from the bbcode_quote template. I've bolded the changes:

Code:

<div class="bbcode_container">

    <div class="bbcode_quote">

        <div class="quote_container">

<div class="quote_left"><img align="left" src="/images/quote-left.png" /></div>

            <vb:if condition="$show['username']">

                <div class="bbcode_postedby">

                    <img src="{vb:stylevar imgdir_misc}/quote_icon.png" alt="{vb:rawphrase quote}" /> {vb:rawphrase originally_posted_by_x, {vb:raw username}}

                    <vb:if condition="$postid"><a href="{vb:raw $vboptions.vbforum_url}{vb:if "$vboptions['vbforum_url']", '/', ''}showthread.php?{vb:raw session.sessionurl}p={vb:raw postid}#post{vb:raw postid}" rel="nofollow"><img class="inlineimg" src="{vb:stylevar imgdir_button}/viewpost-{vb:stylevar right}.png" alt="{vb:rawphrase view_post}" /></a></vb:if>

                </div>

                <div class="message">{vb:raw message}</div>

            <vb:else />

                {vb:raw message}

            </vb:if>

<div class="quote_right"><img align="right" src="/images/quote-right.png" /></div>

        </div>

    </div>

</div>

Finally here is a link to an example:

http://thepixelpirate.net/showthread...-please-ignore

I'm not a CSS expert, but doing a search for "float image to bottom right" I find that there's no good way to do it. There's mention of doing it via javascript or by using a table, but I don't know how either of those would work (I guess there's no reason you couldn't use a table, if you can figure that one out. Here's one of the links I found that talks about the issue: http://stackoverflow.com/questions/4...ttom-right-div).

As for the padding, your CSS has left padding for quote_left and right padding for quote_right, and that seems to be what's there.

OK, I got as far as getting the image to the bottom right, but the text does not wrap around it. Here is the code:

Example: http://thepixelpirate.net/showthread...-please-ignore

Code:

.quote_left {

padding:10px;

float:left;

}



.quote_right {

padding:10px;

float:right;

position: absolute; 

bottom:0;

right:0;

}

Code:

<div class="bbcode_container">

    <div class="bbcode_quote">

        <div class="quote_container">

<div class="quote_left"><img src="/images/quote-left.png" /></div>

<div class="quote_right"><img src="/images/quote-right.png" /></div>

            <vb:if condition="$show['username']">

                <div class="bbcode_postedby">

                    <img src="{vb:stylevar imgdir_misc}/quote_icon.png" alt="{vb:rawphrase quote}" /> {vb:rawphrase originally_posted_by_x, {vb:raw username}}

                    <vb:if condition="$postid"><a href="{vb:raw $vboptions.vbforum_url}{vb:if "$vboptions['vbforum_url']", '/', ''}showthread.php?{vb:raw session.sessionurl}p={vb:raw postid}#post{vb:raw postid}" rel="nofollow"><img class="inlineimg" src="{vb:stylevar imgdir_button}/viewpost-{vb:stylevar right}.png" alt="{vb:rawphrase view_post}" /></a></vb:if>

                </div>

                <div class="message">{vb:raw message}</div>

            <vb:else />

                {vb:raw message}

            </vb:if>

        </div>

    </div>

</div>

I don't think it's going to be easy. Read some of the threads linked here - http://stackoverflow.com/questions/4...ttom-right-div

Yeah, I read that one already. Thanks anyway.

X vBulletin 3.8.12 by vBS Debug Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (4)bbcode_code_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)post_thanks_navbar_search (1)printthread (5)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.php ./global.php ./includes/init.php ./includes/class_core.php ./includes/config.php ./includes/functions.php ./includes/class_hook.php ./includes/modsystem_functions.php ./includes/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.php Hooks Called: init_startup init_startup_session_setup_start init_startup_session_setup_complete cache_permissions fetch_threadinfo_query fetch_threadinfo fetch_foruminfo style_fetch cache_templates global_start parse_templates global_setup_complete printthread_start bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages:

Phrase Groups Available:

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.00966 seconds Memory Usage 1,728KB Queries Executed 10 (?)
More Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (4)bbcode_code_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)post_thanks_navbar_search (1)printthread (5)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.php ./global.php ./includes/init.php ./includes/class_core.php ./includes/config.php ./includes/functions.php ./includes/class_hook.php ./includes/modsystem_functions.php ./includes/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.php Hooks Called: init_startup init_startup_session_setup_start init_startup_session_setup_complete cache_permissions fetch_threadinfo_query fetch_threadinfo fetch_foruminfo style_fetch cache_templates global_start parse_templates global_setup_complete printthread_start bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages: