Resolved Alignment in Frontend export

Hello,

A CSS file is added for the next release.

Hello,
Thank you for feedback, we will look into this improvement.

Hello,

but the alignment of the column headers and the values seems random

I can assure you that there is no randomizer in CSVI that changes the output every time you look at the page.

If you look at the source, this is a very simple table layout in the format:

<table><thead><tr><th></th></tr></thead><tbody><tr><td></td></tr></tbody></table>

Could you please improve it so that it looks clean and clear.

What we will do is add a custom CSS file, that way you can style it as you like.

Thank you, I think only with column headers and values aligned left or center would be fine for most users but if you add a CSS file, even better.

Regards

Hi guys,

I think I read this file was added in your news, can you tell me where is located or how to use it in a concrete template? is there any documentation?

I just want to center and aligne values and column headers basicly

Regards

Hello,
You can create your own custom css by adding file at location media/com_csvi/css/exporttable.css. You need to have the file created with name as exporttable.css, CSVI will include it in HTML export automatically when file is found at this location. There is no documentation on this yet.

Thank you, so exporttable.css will apply to all frontend HTML exports?

Regards

Hello,
Yes, exporttable.css will apply to all frontend HTML exports.

Hi, Im quite lost in this one.

I added exporttable.css in /public_html/media/com_csvi/css

media/com_csvi/css didnt exist so I had to create those folders.

I don't see any effect with different settings in the css file

Regards


PD:
Can you tell me a simple CSS to aligne column headers and values?

Hello,

Can you see that the CSS file is loaded? Just like regex, I am no CSS-guru either. Search engines help us by finding the answers All I know is you can align stuff with the CSS tag text-align. Perhaps you can use that.

I have checked the source code and I see no reference to the css code or file.

Yeah I googled already and I have tested even crazy css codes changing background etc just to see it it works.

I don't see any reference in the export log either but I guess is normal there.


Regards

Hello,

CSVI checks if the following file exists /media/com_csvi/css/exporttable.css, if this file exists it adds this HTML code

<link href="/media/com_csvi/css/exporttable.css" rel="stylesheet" />

that is the code you should see if you check the source of the page. If this line is not there, no CSS will be applied because the file is not loaded.

Hello

I don't see that line in the source, that is why I was asking if this function is working properly.

I updated from 7.00 to 7.0.2 in case that fixed it but still don't get that line,

Regards

Hello,
The only reason it should not work is when the file exporttable.css is not found in the location. The code written is to just check for existence of file and to include it. Can you send me FTP and site administrator access details to check?

I have send you details to your gmail account.

Thanks

Tharuna helped me and the line is showing but as much as I try to style the page I can't manage to.

I have tried like 20 different codes and even bootstrap classes.

Our template is bootstrap and a simple ".table" should already style a table.

I tried adding

.table

in the exporttable.css and even removing the exportable.css and adding the ".table" in the menu item CSS class but I think CSVIpro is not reading the menu item settings cause it doesnt read the CSS class there.

I have tried all the codes in a link that tharuna kindly suggested https://www.granneman.com/webdev/coding/css/centertables/ also

Bootstrap classes etc

Can't even get this to work:

table, th, td {
border: 1px solid black;
}

Can you please check in your sample installations if the css actually works for you? I know the line: <link href="media/com_csvi/css/exporttable.css" rel="stylesheet" /> is there but has no effect.

Hello,

You can't use the bootstrap classes because bootstrap is not loaded. The .table class would only work if you add that to the HTML markup. You are right, CSVI doesn't do anything with the menu settings.

Can't even get this to work:

table, th, td {
border: 1px solid black;
}

That should work.

Can you please check in your sample installations if the css actually works for you?

As requested it worked for me when I tried. Since I know you don't tell fairy tales I looked further and found that in certain circumstances it wouldn't work. To deal with these circumstances too I made a patch for you that I think should make it work for you as well.

Can you load the patch and see if your CSS file is working?

oh yeah! that worked Roland

Trust me I dont like posting unless is something we can't really solve or need but I was getting completely crazy with this one since no css code worked for me

Regards