Site logo

Archived topic

Removing the additional information borders

11 replies · Started by Hana on June 7, 2022

Viewing posts 1–12 of 12

Hello, How to Remove the additional information borders in the single product page, I want them for example like this with no table borders

Color: Black
Size: Small
Material: Cotton

Hi there,

can you share a link to a product where i can see them ?

please check the private link

Try this CSS:

.woocommerce .woocommerce-tabs table.shop_attributes th, 
.woocommerce .woocommerce-tabs table.shop_attributes tr, 
.woocommerce .woocommerce-tabs table.shop_attributes td {
    border: 0;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

It doesn't work my dear

Hi Hana,

Try this:

.woocommerce .woocommerce-tabs table.shop_attributes th, 
.woocommerce .woocommerce-tabs table.shop_attributes tr, 
.woocommerce .woocommerce-tabs table.shop_attributes td, 
.woocommerce table.shop_attributes{
    border: 0;
}

Sorry Ying, It doesn't work

Hi Hana,

Tested the code and it should work.

See: https://share.getcloudapp.com/ApuXOW0p

May we know how you’re adding the CSS code? Can you try adding it in Appearance > Customize > Additional CSS?

Moreover, I can see that you added PHP code in Appearance > Customize > Additional CSS. This would cause other code not to work in there. PHP code shouldn’t be added there. Kindly remove all non-CSS code in your Additional CSS and see how it goes.

For instance, you have this code in Additional CSS:

add_filter( 'woocommerce_product_tabs', 'woo_rename_tabs', 98 );
function woo_rename_tabs( $tabs ) {

	$tabs['description']['title'] = __( 'More Information' );		// Rename the description tab
	$tabs['reviews']['title'] = __( 'Ratings' );				// Rename the reviews tab
	$tabs['additional_information']['title'] = __( 'Product Data' );	// Rename the additional information tab

	return $tabs;

}

This is PHP code and should be add through a plugin like Code Snippets for instance.

Adding PHP reference: https://docs.generatepress.com/article/adding-php/#code-snippets

Kindly let us know.

It is work now my dear :)
but how to remove grey line mentioned in this screenshot
[url=https://postimg.cc/nMXNCcsQ][img]https://i.postimg.cc/gcsptxm4/grey-line.jpg[/img][/url]

Try this:

.woocommerce table.shop_attributes tr:nth-child(even) td, .woocommerce table.shop_attributes tr:nth-child(even) th {
    background: none;
}

That is great
Thank you Leo :)

No problem :)

This archived topic is closed to new replies.