fantoan on "[Plugin: TablePress] Tablepress not working with bootstrap?"

Hello,i have question.
I create button for coupon site with plugin My shortcode

code HTML: <input onclick=" window.open('{{link}}'); s=prompt('use this coupon','{{code}}') " type="button" value="{{title}}"class="btn btn-success sourceindex=" 1"="" sourceindex="2">
And i added css library with https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css

When i use this shortcode on post,it working.But when i added shortcode in Tablepress css not work(color,background button)

See http://i.imgur.com/suGEYZt.jpg

https://wordpress.org/plugins/tablepress/

Hi,

thanks for your question, and sorry for the trouble.

I'm not sure how TablePress could affect this, to be honest... Can you please post a link to the page with the table where this problem happens, so that I can take a direct look? A screenshot does not allow me to investigate the code. Thanks!

Regards,
Tobias

Hi Tobias
It working.Thanks for reply
But i have other question.When i insert image in table,this table look on pc very good,but on my smartphone table not responsive.Size of image not change
http://magiamgialazada.com/test/

Hi,

thanks for your link!

From what I can, see there are some errors in your HTML code for the button. It currently looks like

value="DEMO BUTTON"class="btn btn-success sourceindex=" 1"="" sourceindex="2">

This should be

value="DEMO BUTTON" class="btn btn-success" sourceindex="1">

For the images: Please add this to the "Custom CSS" textarea on the "Plugin Options" screen of TablePress:

.tablepress-id-1 img { max-width: 100%;
}

Regards,
Tobias

Thanks Tobias
It works.on smartphone image look good,but column widths so bad.i want table like that
https://goo.gl/zMdvyo
how i set column widths,color and 4 row header.

Hi,

please see the TablePress FAQ for CSS code the column widths and the color: https://tablepress.org/faq/

Regards,
Tobias

i added css code
.tablepress-id-1 .column-1 {
width: 500px;
}
But on smartphone not working.i want first column width larger.like that
first column width 60%-second column width 15%-third column width-25%

Hi,

then set it to a percentage width, like

width: 60%;

Note that you can not always reduce the width of the second and third column, because the content in those cells also needs space. For example, that "flgjmr;gkmreo" forces that column to have a certain minimum width, because the browser can not add automatic word-wrapping into this "word".

I recommend using e.g. the developer tools in your browser to investigate the CSS and its behavior.

Regards,
Tobias

Thanks Tobias!

Hi,

sure, no problem, you are very welcome!

Best wishes,
Tobias

Hi Tobias
I have a problem
when i add css code for new row header
.tablepress-id-1 .row-6 td {
background-color: #2bafa4;
border: 1px solid #2bafa4;
text-align: center;
font-size: 16px;
font-weight: 600;
color: black;
padding: 2px 5px;
}

Background not working.(row-6)

Hi Tobias
I have a problem
when i add css code for new row header
.tablepress-id-1 .row-6 td {
background-color: #2bafa4;
border: 1px solid #2bafa4;
text-align: center;
font-size: 16px;
font-weight: 600;
color: black;
padding: 2px 5px;
}

Background not working.(row-6)
http://magiamgialazada.com/test/

Hi,

you need to increase the priority, so that it overrides some theme CSS. Please try

background-color: #2bafa4 !important;

Regards,
Tobias

Thank you very much!