asked on

css question wordpress

i bought this theme and it seems that it's using custom css for some html properties..

demo.wpbakery.com/lightning/features/

I created a copy of the theme on my website, and added some automatically syndicated content that was already formatted and styled with CSS.. and the buttons are now a bit broken:

cloudcarib.bz/vmware

any ideas how I can bypass the theme’s custom CSS for this page only.. or even for the whole theme?

which property could be causing this break.. maybe some sort of padding?

Jason C. Levine

The buttons are using tables to break them into left edge/middle button/right edge but the widths on the table are set to 100% whereas the cells have no width declaration. So the content you added stretches the table out too wide and the gaps appear.

Just change the widths on the tables and cells to match the complete button element and image widths respectively and it should snap back into place.

darkbluegr

ASKER

thank you for the quick reply, unfortunately i do not have any control into the content that gets pushed to the site , it's just a wordpress shortcode that i insert, and the syndicated content gets added to the site. so i was wondering if i could control the tables formatting on the theme side?

Jason C. Levine

Not really.

You can add a new CSS declaration locally for classes clsSVButton and clsSVCursor and try to constrain the width of the table that way (use !important so it gets picked up properly) but if that doesn't work then you'll have to contact whoever is providing this content and get them to code it correctly.

darkbluegr

ASKER

this is very helpful, thank you

may i trouble you for the syntax of this css declaration of clsSVButton?

ASKER CERTIFIED SOLUTION

Jason C. Levine

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

darkbluegr

ASKER

Hmmm seems fixed size wont work on some other sub-pages:

cloudcarib.bz/vmware?svpage=solution_serverconsol&sid=4f63e0d9d331fd7fd540d4a7e6aadfc8

I guess we are out of luck?

Jason C. Levine

Yeah. Short of contacting the content provider or really blowing up all CSS related to tables locally (even then, may not work) and tweaking you are out of luck.

darkbluegr

ASKER

thank you

darkbluegr

ASKER

thanks

darkbluegr

ASKER

the theme designer suggested adding this custom code. It improved the appearance but some gaps still display. any thoughts on how to fix the remaining small gap by using this method?

##

.page-id-1071 .main_content table {
border: none;
margin: 0;
text-align: inherit;
width: auto;
}

.page-id-1071 .small_tour_menu_ul li.odd,
.page-id-1071 .main_content table tr.even,
.page-id-1071 .main_content table tr {
background: none;
}

.main_content tr td.page-id-1071 {
border: none;
padding: inherit;
}