Support Home Page › Forums › Joomla Software › Advanced Folder Listing Component › How to set Table width
- This topic has 9 replies, 2 voices, and was last updated 10 years, 7 months ago by Michael Gilkes.
-
AuthorPosts
-
March 10, 2014 at 6:18 pm #577rpierceParticipant
Advanced Folder Listing 1.5.6
Menu: Single Table Listing
If I disbale the “Enable Archive Download”, the table-width shrinks. If I enable this feature, the table width is 100%.
How can I get a table width of 100% without the “Enable Archive Download” feature?
In the Mappings, I have “Filename” set to 80%, and “Size” set to 20%. I only want these two mappings. However, the table-width shrinks to width of the longest file name.
What am I missing?
Thanks,
Ron
March 10, 2014 at 8:09 pm #1829Michael GilkesKeymaster@rpierce. Thanks for posting, Ron. Can I get a link to the webpage with the listing?
I would like to actually see what you are referring to. I don’t quite understand what you are saying. So, it would be best for you to just show me. I need to see the page, so that I can examine the underlying html/css in the DOM. So, even if you send me a screenshot, it would only help a little, but I need to examine the page directly.
March 11, 2014 at 2:30 am #1830rpierceParticipantHi Michael,
I emailed you a link to my test website, with access to the back-end.
You will find that if the List setting is changed to “Enable Archive Download” to “NO”, then the table width is less than 100%
Hope you can find a solution.
I love this component…..makes my hidden files downloadable.
Thanks,
Ron
March 11, 2014 at 2:38 am #1831Michael GilkesKeymaster@rpierce. I sent you back a response 2 hours ago. Didn’t you get my email?
March 11, 2014 at 3:08 am #1832rpierceParticipantHi Michael,
No, I didn’t get your email.
Would you kindly re-send it.
Thanks,
Ron
March 11, 2014 at 3:45 am #1833Michael GilkesKeymaster@Ron. Ok. I just re-sent it. It has two screenshot attachments. Will talk to you tomorrow about it, once I get your reply.
March 11, 2014 at 4:10 am #1834rpierceParticipantHi Michael,
Sorry, again I didn’t get the email.
Can you check that it is: ron@rpierce.ca
Thanks.
By the way, I will be away tomorrow, so I may not respond right away.
Thanks for your help.
Ron
March 11, 2014 at 11:04 am #1835Michael GilkesKeymaster@Ron. Did you check your spam folder? It was sent from support[at]valorapps[dot]com. i will send it again in a few minutes. Does your email block attachments? I will upload the screenshots to an image sharing site this time. And yes… I sent it to ron[at]rpierce.ca. I just hit “Reply” on the email you sent me.
March 11, 2014 at 2:16 pm #1836Michael GilkesKeymaster@Ron. I sent you another email a few minutes ago. If you want, i can post the email’s contents here in the forum. I was just trying to maintain your privacy. Let me know what you want to do.
March 11, 2014 at 4:33 pm #1837Michael GilkesKeymaster@Ron. As per your request… below is the email I sent to you several times:
========================
Hi Ron,
Ok… here is the run down.
If you check the DOM as well as the style sheets you will see that width of the table is not set to 100%. It is set to “inherit” (See for reference: http://www.w3.org/TR/CSS2/about.html#inherited-prop). Normally, this means that the width would be inherited from the parent element.
When multi-download is disabled, the parent element is the containing div of class art-postcontent. To be honest, since the width of that div is 854px, the table should be the same. I am not sure why it is 280px instead. However, when the multi-download is enabled, I engulf the table in a form element. So, the table inherits the width of the form, which is 854px.
So, it is not that the multi-download feature is changing the width of the table, in strict terms. None of the code is actually doing this. You have to realize that the “cascading” feature of CSS causes these types of artifacts.
You can easily verify everything that I said by right clicking on the table and selecting “Inspect Element”, and you will see what I am saying in the browser’s console. I have attached 2 screenshots for you to reference.
Understanding this is one thing…. however, you can force the width of the table by editing the styles.css file located in media/advlisting/css folder. You can change it from width: inherit; to width:100% if you want.
Hope this helps,
Michael
PS. I removed the attachments. Here are the links:
-
AuthorPosts
- The topic ‘How to set Table width’ is closed to new replies.