[3.2] css center img stopped working within nested BBcodes

Discussion forum for Extension Writers regarding Extension Development.
Post Reply
User avatar
3Di
I've Been Banned!
Posts: 17538
Joined: Mon Apr 04, 2005 11:09 pm
Location: I'm with Ukraine 🇺🇦
Name: Marco
Contact:

[3.2] css center img stopped working within nested BBcodes

Post by 3Di »

Hi all,
a small and tedious glitch here (one of those of mine)..

Using css to center an image posted within nested BBcodes works just fine in 3.1, but 3.2

markup
(we are working inside QUOTE, with URL and IMG BBcodes)

Code: Select all

[quote][url=http://www.ansa.it/webimages/img_700/2018/2/10/233b7725a81a379eb3d4f64f38d6abb9.jpg][img]http://www.ansa.it/webimages/img_210x145/2018/2/10/233b7725a81a379eb3d4f64f38d6abb9.jpg[/img][/url][/quote]
css

Code: Select all

blockquote .postimage, .quotecontent .postimage {
	display: block;
	margin: 0 auto;
}
The Q is quite obvious but, well.. what should I do to make it possible again?

Using a custom bbcode is not the option here.

TIA :)
🆓 Free support for our extensions also provided here: phpBB Studio
🚀 Looking for a specific feature or alternative option? We will rock you!
Please PM me only to request paid works. Thx. Buy me a coffee -> Image
My development's activity º PhpStorm's proud user º Extensions, Scripts, MOD porting, Update/Upgrades
User avatar
JoshyPHP
Code Contributor
Posts: 1288
Joined: Mon Jul 11, 2011 12:28 am

Re: [3.2] css center img stopped working within nested BBcodes

Post by JoshyPHP »

You should post the HTML produced by 3.1 and the one from 3.2.
I wrote the library that handles markup in phpBB 3.2+.
User avatar
3Di
I've Been Banned!
Posts: 17538
Joined: Mon Apr 04, 2005 11:09 pm
Location: I'm with Ukraine 🇺🇦
Name: Marco
Contact:

Re: [3.2] css center img stopped working within nested BBcodes

Post by 3Di »

JoshyPHP wrote: Sun Feb 11, 2018 6:11 pm You should post the HTML produced by 3.1 and the one from 3.2.
3.1.1

Markup

Code: Select all

[quote="3Di"]3Di_png_logo.png
[url=http://127.0.0.1/QI/boards/3111_tpotm/download/file.php?id=1&mode=view][img]http://127.0.0.1/QI/boards/3111_tpotm/download/file.php?id=1[/img][/url][/quote]
DB

Code: Select all

[quote="3Di":3groi71m]3Di_png_logo.png
[url=http://127.0.0.1/QI/boards/3111_tpotm/download/file.php?id=1&mode=view:3groi71m][img:3groi71m]http://127.0.0.1/QI/boards/3111_tpotm/download/file.php?id=1[/img:3groi71m][/url:3groi71m][/quote:3groi71m]
HTML generated - browser
.
3.1.11-quote_attachmentent_centered_css.png
#--------------------------------------------------------------------------------------------

3.2.1

Markup

Code: Select all

[quote=3Di post_id=284 time=1518386322 user_id=2]3Di_png_logo.png
[url=http://127.0.0.1/QI/boards/hlposts/download/file.php?id=13&mode=view][img]http://127.0.0.1/QI/boards/hlposts/download/file.php?id=13[/img][/url][/quote]
DB

Code: Select all

<r><QUOTE author="3Di" post_id="284" time="1518386322" user_id="2"><s>[quote=3Di post_id=284 time=1518386322 user_id=2]</s>3Di_png_logo.png<br/>
<URL url="http://127.0.0.1/QI/boards/hlposts/download/file.php?id=13&amp;mode=view"><s>[url=http://127.0.0.1/QI/boards/hlposts/download/file.php?id=13&amp;mode=view]</s><IMG src="http://127.0.0.1/QI/boards/hlposts/download/file.php?id=13"><s>[img]</s><LINK_TEXT text="download/file.php?id=13">http://127.0.0.1/QI/boards/hlposts/download/file.php?id=13</LINK_TEXT><e>[/img]</e></IMG><e>[/url]</e></URL><e>[/quote]</e></QUOTE></r>
HTML generated - browser
.
3.2.1-quote_attachmentent_centered_css_error.png
#--------------------------------------------------------------------------------------------

The attachments are being quoted via an extension of mine which emulates the BBcode markup, simply.
Btw, the same issue happens if you post an IMG (link) within the URl and QUOTE bbtags, but here we go:

Relevant code: https://github.com/3D-I/qaip/blob/bb33e ... #L119-L276

Thanks for your interest, Joshy. :)
🆓 Free support for our extensions also provided here: phpBB Studio
🚀 Looking for a specific feature or alternative option? We will rock you!
Please PM me only to request paid works. Thx. Buy me a coffee -> Image
My development's activity º PhpStorm's proud user º Extensions, Scripts, MOD porting, Update/Upgrades
User avatar
JoshyPHP
Code Contributor
Posts: 1288
Joined: Mon Jul 11, 2011 12:28 am

Re: [3.2] css center img stopped working within nested BBcodes

Post by JoshyPHP »

Can you post the HTML of the relevant portion of each post in 3.1 and 3.2 as it can be seen in the source of the page?
I wrote the library that handles markup in phpBB 3.2+.
User avatar
3Di
I've Been Banned!
Posts: 17538
Joined: Mon Apr 04, 2005 11:09 pm
Location: I'm with Ukraine 🇺🇦
Name: Marco
Contact:

Re: [3.2] css center img stopped working within nested BBcodes

Post by 3Di »

I am not sure I am getting what you would like me to do, sorry.

Do you like the HTML generated to be copy/pasted here instead of the attachments I above posted, maybe?

Edit: I guess I got it, wait pls.
🆓 Free support for our extensions also provided here: phpBB Studio
🚀 Looking for a specific feature or alternative option? We will rock you!
Please PM me only to request paid works. Thx. Buy me a coffee -> Image
My development's activity º PhpStorm's proud user º Extensions, Scripts, MOD porting, Update/Upgrades
User avatar
JoshyPHP
Code Contributor
Posts: 1288
Joined: Mon Jul 11, 2011 12:28 am

Re: [3.2] css center img stopped working within nested BBcodes

Post by JoshyPHP »

Here's what I get on 3.2:

Code: Select all

<blockquote class="uncited"><div><img src="images/smilies/icon_e_biggrin.gif" class="postimage" alt="Image"></div></blockquote>
When I add the CSS you mentioned above, the image appears centered in the quote. I expect the HTML generated by 3.1 to be equivalent to the one generated by 3.2 and therefore the image to be appear centered in both versions. In other words, it works for me and if it doesn't work for you then something else is in play.
I wrote the library that handles markup in phpBB 3.2+.
User avatar
3Di
I've Been Banned!
Posts: 17538
Joined: Mon Apr 04, 2005 11:09 pm
Location: I'm with Ukraine 🇺🇦
Name: Marco
Contact:

Re: [3.2] css center img stopped working within nested BBcodes

Post by 3Di »

3.2

Code: Select all

<div class="content"><blockquote><div><cite><a href="./memberlist.php?mode=viewprofile&amp;u=2">3Di</a> wrote: <a href="./viewtopic.php?p=284#p284" data-post-id="284" onclick="if(document.getElementById(hash.substr(1)))href=hash">↑</a><div class="responsive-hide">11 Feb 2018 22:58</div></cite>3Di_png_logo.png<br>
<a href="http://127.0.0.1/QI/boards/hlposts/download/file.php?id=13&amp;mode=view" class="postlink"><img src="http://127.0.0.1/QI/boards/hlposts/download/file.php?id=13" class="postimage" alt="Image"></a></div></blockquote></div>
3.1

Code: Select all

<div class="content"><blockquote><div><cite>3Di wrote:</cite>3Di_png_logo.png<br /><a href="http://127.0.0.1/QI/boards/3111_tpotm/download/file.php?id=1&amp;mode=view" class="postlink"><img src="http://127.0.0.1/QI/boards/3111_tpotm/download/file.php?id=1" class="postimage" alt="Image" /></a></div></blockquote><br /><br /><img src="http://127.0.0.1/QI/boards/3111_tpotm/download/file.php?id=1" class="postimage" alt="Image" /></div>
🆓 Free support for our extensions also provided here: phpBB Studio
🚀 Looking for a specific feature or alternative option? We will rock you!
Please PM me only to request paid works. Thx. Buy me a coffee -> Image
My development's activity º PhpStorm's proud user º Extensions, Scripts, MOD porting, Update/Upgrades
User avatar
JoshyPHP
Code Contributor
Posts: 1288
Joined: Mon Jul 11, 2011 12:28 am

Re: [3.2] css center img stopped working within nested BBcodes

Post by JoshyPHP »

Interesting. I have no idea why it doesn't work for you, sorry. Try another browser just in case.
I wrote the library that handles markup in phpBB 3.2+.
User avatar
3Di
I've Been Banned!
Posts: 17538
Joined: Mon Apr 04, 2005 11:09 pm
Location: I'm with Ukraine 🇺🇦
Name: Marco
Contact:

Re: [3.2] css center img stopped working within nested BBcodes

Post by 3Di »

FF the latest here, let me try with the latest Chrome then..
🆓 Free support for our extensions also provided here: phpBB Studio
🚀 Looking for a specific feature or alternative option? We will rock you!
Please PM me only to request paid works. Thx. Buy me a coffee -> Image
My development's activity º PhpStorm's proud user º Extensions, Scripts, MOD porting, Update/Upgrades
User avatar
3Di
I've Been Banned!
Posts: 17538
Joined: Mon Apr 04, 2005 11:09 pm
Location: I'm with Ukraine 🇺🇦
Name: Marco
Contact:

Re: [3.2] css center img stopped working within nested BBcodes

Post by 3Di »

Same in Chrome v64.0.3282.140

3.1.1 = centering works

3.2.1 = centering does not works


edit, same in IE11 too
🆓 Free support for our extensions also provided here: phpBB Studio
🚀 Looking for a specific feature or alternative option? We will rock you!
Please PM me only to request paid works. Thx. Buy me a coffee -> Image
My development's activity º PhpStorm's proud user º Extensions, Scripts, MOD porting, Update/Upgrades
User avatar
3Di
I've Been Banned!
Posts: 17538
Joined: Mon Apr 04, 2005 11:09 pm
Location: I'm with Ukraine 🇺🇦
Name: Marco
Contact:

Re: [3.2] css center img stopped working within nested BBcodes

Post by 3Di »

JoshyPHP wrote: Sun Feb 11, 2018 10:52 pm Interesting. I have no idea why it doesn't work for you, sorry. Try another browser just in case.
Your test works, it is just a link to an image using IMG, mine (and thus this topic) it is another stuff..

URL={your url to a full image} IMG {your url to a thumbnail image} /IMG /URL

And here we go, in 3.2.1 only your test above works but mine,
in 3.1.1 both works.

that's 3.2 - your works but not mine (nested bbcodes)
.
Screenshot_1.png
like this (click on the thumb pic)
Image
🆓 Free support for our extensions also provided here: phpBB Studio
🚀 Looking for a specific feature or alternative option? We will rock you!
Please PM me only to request paid works. Thx. Buy me a coffee -> Image
My development's activity º PhpStorm's proud user º Extensions, Scripts, MOD porting, Update/Upgrades
User avatar
3Di
I've Been Banned!
Posts: 17538
Joined: Mon Apr 04, 2005 11:09 pm
Location: I'm with Ukraine 🇺🇦
Name: Marco
Contact:

Re: [3.2] css center img stopped working within nested BBcodes

Post by 3Di »

the above markup is (i post here cause in this board runs CAMO

[quote][url=http://www.ansa.it/webimages/img_700/2018/2/10/233b7725a81a379eb3d4f64f38d6abb9.jpg][img]http://www.ansa.it/webimages/img_210x145/2018/2/10/233b7725a81a379eb3d4f64f38d6abb9.jpg[/img][/url][/quote]

and with my css renders as centered in 3.1
🆓 Free support for our extensions also provided here: phpBB Studio
🚀 Looking for a specific feature or alternative option? We will rock you!
Please PM me only to request paid works. Thx. Buy me a coffee -> Image
My development's activity º PhpStorm's proud user º Extensions, Scripts, MOD porting, Update/Upgrades
User avatar
mrgoldy
Former Team Member
Posts: 1394
Joined: Tue Oct 06, 2009 7:34 pm
Location: The Netherlands
Name: Gijs
Contact:

Re: [3.2] css center img stopped working within nested BBcodes

Post by mrgoldy »

I can't find it now, but I believe the post links are rendered as display: inline-block.
That would mean that the image inside the link is centered towards its parent (the link), but the parent is not the full width of the post.
phpBB Studio / Member of the Studio

Contributing: You can do it too! Including testing Pull Requests (PR).
phpBB Development and Testing made easy.
User avatar
3Di
I've Been Banned!
Posts: 17538
Joined: Mon Apr 04, 2005 11:09 pm
Location: I'm with Ukraine 🇺🇦
Name: Marco
Contact:

Re: [3.2] css center img stopped working within nested BBcodes

Post by 3Di »

posey wrote: Mon Feb 12, 2018 8:16 am I can't find it now, but I believe the post links are rendered as display: inline-block.
That would mean that the image inside the link is centered towards its parent (the link), but the parent is not the full width of the post.
In fact, links.css - removing such display does center again the images within URL, in 3.2.1
.
Screenshot_2.png
.

Brilliant, I will amend the css for 3.2 then.

Thank you. :)
🆓 Free support for our extensions also provided here: phpBB Studio
🚀 Looking for a specific feature or alternative option? We will rock you!
Please PM me only to request paid works. Thx. Buy me a coffee -> Image
My development's activity º PhpStorm's proud user º Extensions, Scripts, MOD porting, Update/Upgrades
User avatar
3Di
I've Been Banned!
Posts: 17538
Joined: Mon Apr 04, 2005 11:09 pm
Location: I'm with Ukraine 🇺🇦
Name: Marco
Contact:

Re: [3.2] css center img stopped working within nested BBcodes

Post by 3Di »

Solved this way, added some CSS to the existing one

Code: Select all

blockquote .postlink, .quotecontent .postlink {
	display: block;
	text-decoration: none;
	border-bottom: none;
	padding-bottom: 0;
}
🆓 Free support for our extensions also provided here: phpBB Studio
🚀 Looking for a specific feature or alternative option? We will rock you!
Please PM me only to request paid works. Thx. Buy me a coffee -> Image
My development's activity º PhpStorm's proud user º Extensions, Scripts, MOD porting, Update/Upgrades
Post Reply

Return to “Extension Writers Discussion”