Dora
Dora

Reputation: 285

How to remove white line in My Account Woocommerce?

I have one issue with settings CSS for My Account page, in my site.

I want to remove that white line and merge the footer and page content. I tryed to add this CSS:

#primary, .woocommerce-page #primary, .woocommerce #secondary, .woocommerce-    page #secondary {
margin-bottom:-40px;
}

bit that code make a mess with footer with other pages ,where white line is not persist. How to remove white line only in My Account page? That white line is visible only when user is logged in.

Thanks in advance.

Upvotes: 1

Views: 71

Answers (2)

Dora
Dora

Reputation: 285

This worked:

#primary {
min-height: calc(100vh - 222px);
}

Upvotes: 1

Ruskin
Ruskin

Reputation: 6171

The problem is with:

#primary {
  min-height: 100vh;
}

because the primary div is not starting from the top of the page. Removing that should fix it ... but check it does not break other pages.

One slightly hacky way to fix would to create a number of rules at different media breakpoints for

#primary {
  min-height: calc(100vh - [heightOfHeader] - [heightOfFooter]);
}

e.g for mobile breakpoints it might be the following ... but you will have to fix the footer at narrow screen widths.

#primary {
  min-height: calc(100vh - 222px);
}

and for larger

#primary {
  min-height: calc(100vh - 123px);
}

but watch out ... you have your buttons wrapping at some page widths.

Upvotes: 0

Related Questions