You need to be logged in to post in the forum - Log In

An active JCE Pro Subscription is required to post in the forum - Buy a Subscription

  Monday, 02 May 2022
  4 Replies
  0.9K Visits
Hi,
I wish the list of attached files appeared like in the JCE input area https://www.awesomescreenshot.com/image/26551438?key=2d6217f59b2daa42a91029ad7ba0675d
but it actually shows like this https://www.awesomescreenshot.com/image/26551557?key=b06d264af46e3c831fae5309df3c385e

Here is the auto-generated code:
<p><a href="images/allegati/Allegato-3-Scheda-di-sintesi-2021.pdf" target="_blank" class="wf_file"><img src="media/jce/icons/pdf.png" alt="pdf" class="wf_file_icon" style="border: 0px; vertical-align: middle; max-width: inherit;" /><span class="wf_file_text">Allegato 3. Scheda di sintesi 2021</span></a></p>

What am I supposed to edit (once!) in order to have pdf icon and file name on the same line?

Thank you
Andrea
more than a month ago
·
#110938
Accepted Answer
Your template stylesheet includes the following css rule for images:


img {
display: block;
max-width: 100%;
height: auto;
}


The display:block style is what is forcing the image to be on a new line. You can fix this in a number of ways:

Add the any of the following to your template stylesheet:


img {
display: inline-block;
}


or


a img {
display: inline-block;
}


or


img.wf_file_icon {
display: inline-block;
}


The last one specifically targets the file link icon.

Just because you're not paranoid doesn't mean everybody isn't out to get you.

more than a month ago
·
#110933
I suspect this is caused by some css in your site's template. Please post a link to an example article containing these links on your site.

Just because you're not paranoid doesn't mean everybody isn't out to get you.

more than a month ago
·
#110936
Hi, thank you for your reply.
Here a page with the issue, but it occours on any single page in the site.
more than a month ago
·
#110938
Accepted Answer
Your template stylesheet includes the following css rule for images:


img {
display: block;
max-width: 100%;
height: auto;
}


The display:block style is what is forcing the image to be on a new line. You can fix this in a number of ways:

Add the any of the following to your template stylesheet:


img {
display: inline-block;
}


or


a img {
display: inline-block;
}


or


img.wf_file_icon {
display: inline-block;
}


The last one specifically targets the file link icon.

Just because you're not paranoid doesn't mean everybody isn't out to get you.

more than a month ago
·
#110941
Perfect, thank you Ryan.
I forgot to tell you I use Helix Framework, it should have helped.

Andrea
Galenos selected the reply #110938 as the answer for this post — 1 year ago
  • Page :
  • 1
There are no replies made for this post yet.
Be one of the first to reply to this post!