19 comments found.
Good luck with your sales
Hey, awesome bit of coding for this. I was wondering if you could help me. I need to center the icons in the box. I tried to edit the CSS myself, but I was not able to get them to center. I just want the boxes with the icon and text to be align center within the box. Is this possible? Below is my example. http://bandeldev.com/index-price.html
Hello, I purchased your product and was wondering if the header could only be shown at the top of the list(only once) instead of with each content row when viewed smaller than 769 pixels.
Hello. Thanks for purchasing.
This product was designed with the core idea that there are 3 possible views (as per screenshots): 1. large screen view (all the headers are at the top of the list) – wider than 769px 2. small screen view (headers displayed with each content row) – up to 769px 3. tiny screen view (everything is in a one long column) – up to 360px
It is possible to change the breakpoint from 769px to some smaller value of your preference, the easiest way to do that is to directly edit responsive-tables.css file and replace the 769px value with yours (or there is another way also mentioned in docs). So if you change it to e.g. 500px, then the “small screen view” will only kick in for screens smaller than 500px
I hope this helps.
Hello, I tried your suggestion but I think I need to remove the headers. How can I do that?
Hello, I figured it out, thanks anyway.
That’s great, thanks for letting me know. Hope everything works well.
hey your code is not working on email browsers I am so sad
It did not work on outlook 2007
Can you help me fix it
Hello shaziya. I am very sorry to hear you run into such issue. Unfortunately, this CSS mini-framework was not intended to be used for email newsletters and any of the email browsers are not included in the officially supported browsers list. Emails usually need a specific approach in writing HTML and CSS in order to be displayed properly across major email browsers, such as inline styles etc. It is not possible to cover this within one framework. You may use a framework as s base for your email styling, however I believe you will need to add a lot of inline styles and perhaps even alter HTML and CSS significantly.
I purchased your Responsive Tables as it looked like it would be relatively easy, and I’m not a CSS knowledgeable person.
I added the responsive-tables.css into my css directory, and added the call to it in my web page. I then tried to add a table as I understood the instructions, but it is not working properly.
The most likely culprit, IMO, would be the CSS file that came with the web page template is creating a conflict.
I was making regular tables for some data I wanted to have on my site, but the tables were not responsive, so that is why I came to codecanyon found this and purchased, but I can’t seem to get it to work correctly.
Hi kmckinstry, many thanks for purchasing the item and letting me know about the issues you are having. However, from the details provided it is a bit difficult to say what exactly is wrong. Could you possibly send me some link to your project to demonstrate the problem, or even an html file? If you prefer not to share the link to the entire world, you may contact me directly via the support tab and ‘contact author’ button.
Pure css? or include library jquery / script
Pure CSS 
Hello
Very nice plugin. Is there anyway to give a space between each row to be more visible where each row ends and where the next row starts?
Chris
Awesome!
How do I install this plugin?
Hello wjt9243, I would rather say it is a CSS framework which you can simply include as any other CSS file, but not a plugin which can be installed. In the download pack there is a documentation file (docs/index.html), where you can find a section “Getting started” with exact steps on how to include the CSS and how to use it with HTML structure. I hope this is helpful to you.
I added to basket and on checkout the price has gone from $4 + 80c VAT, which is fine, only to find a $1.00 handling charge. But the price on checkout is saying $6.00. So in real terms the price payable has rocketed by 50%.
Hi, i’m using a full html theme w/ all styles defined + bootstrap structure. Are classes defined with this item so it will not break any prior ul – li style? Sorry for my english.
Hello. Thank you for your question. The classnames are defined everywhere, so there is no reference in CSS that changes some tag globally. Also, the classes are prefixed with ’.rt-’ and hope this prevents clashing with any other theme you may have. I would like to mention also, that markup is using dl, dt, dd elements instead of ul li.
Hi,
I’m trying to use the css – border-width:thin; to make the border thin, but it does seems to be showing any result, below are some attachment sample for the table thickness,I really need some help on this, thanks.
https://www.sendspace.com/file/4y8g2q https://www.sendspace.com/file/dg1f73Hello, it is very hard to say what is the problem from the image, it would be better to see the actual code. However, I have 2 theories about what is happening. 1. maybe each cell has got border thin, but because there is border above the cell, and below the cell, 2 border of adjacent cells add together and you see a total thicker border between cells. 2. there is something wrong with css code, not exactly with the line border-width: thin. you need to make sure that: a) the css rule actually is applied to the element (potential problem – misspelled classname? incorrect css selector used?) b) the rule get applied, but it gets overriden (is there any other more specific css rule that overrides?);
Hi, I have a couple of questions.
Can you change the column width so that in mobile mode it shows more than 2 columns? And can you decide which columns to hide/show?
Will links work within the table?
Can data be added copying from a CSV document?
Thanks in advance
Hi, many thanks for your questions and apologies for the delay in answering, I was away for a couple of days.
1. In a nutshell, there are 2 modes that the table switches between – mobile and full-width. On mobile it is designed to show only 2 columns because it completely reorganises the data in order to fit in all the information (so first column – the labels, second – the values). In order to allow more columns on mobile you would simply need to customise the framework not to switch to mobile mode on mobile screen and continue showing full width mode with all the columns – like on desktop. This can be achieved by modifying the media queries in the CSS (or LESS) code. I am not sure, if this would be useful for your situation, because all the columns would become very narrow.
2. Links within the table certainly would work, as well as other HTML elements, such as pictures, links, buttons etc.
3. Regarding copying from CSV – there is nothing that comes with a framework that can do that for you. This framework is actually CSS (and LESS) code. It has got HTML examples, so what you need to do is to build the required HTML structure and add the provided CSS file. If you have got data in CSV format, you may use some text editing software to automate the process of building HTML (e.g. replace commas with certain HTML tags). I personally find TextWrangler useful for this task.
I hope this is useful and please feel free to let me know if you have any further questions.
Nice work,just one question.. Can I use it in Wordpress,without making plugin?
Thanks, alamis! I am not very familiar with Wordpress, but I believe you can. As far as I understand, you would need to modify the Wordpress theme you are using by simply adding the responsive tables stylesheet to it. Then anywhere on the website, you would need to place a piece of HTML, which is the actual responsive table (needs to follow certain structure and classnames, examples included in the package). I hope this is helpful.
Hi,
Can I insert images without text? Will the responsive work correctly?
Greetings
Hi,
I think it should work, however let me test that properly for you. I will get back to you in about 1 day and let you know exactly.
Thanks, Lisa
Hi vdifortuna,
I have checked what exactly happens when you add images. As I expected – it works very well, however, you need to keep in mind, that if your image dimensions are larger than a table cell, you need to add a bit of styling to the image, e.g. `img {width: 100%; max-width: 200px; max-height: 266px;}`. Well, this is true to any type of content you may wish to add – tables are fluid, but you may wish to additionally control some of your content inside the table in order to make it not exceed certain width etc.
I have added an example to the live demo, please feel to check it out. I hope this is helpful!
Looks nice, GLWS.
One Question.
This works with a basic table structure only? or also works with jQuery Data Tables?
klerith, thanks!
No, unfortunately this doesn’t work with jQuery data tables, as the suggested HTML structure is different.
The suggested structure is based on unordered list (‘ul’) elements, spans etc., whereas jQuery data tables plugin’s structure is based on a regular table element.
You may double-check if the structure is suitable for you by going to live demo and viewing frame source.
I see the demo and works in a amazing way.
Bookmarked!
GLWS
your framework does not work. test: type in the first line of your example-table (now: Chlorine etc.) only a short word in each cell. then the alignment of the table is completely destroyed. sorry, but with this bug your framework is completly worthless.
jukajuvu, I am sorry to hear that you are having such problem. I have just tested this behaviour on the live example and it works for me, however, I realised that I might have forgotten to include the latest fix for that in the package I released for buyers. Could you possibly bear with me, and I will aim to release the fix ASAP. I am really sorry for any inconvenience caused!
Thanks for the update – now everthing works perfect.
I am very glad, thanks for the info! If you have any questions please feel free to let me know.
