woocommerce checkout page layout break after Force secure checkout

It was looks all fine before I check the Force secure checkout in woocommerce setting. But after I check it ,the checkout page’s layout are totally break. I use firefox Inspect Element and the css is empty.

I guess the reason is after check the “Force secure checkout” the link will change from https://www.domain.com/wp-content/xxxx to https://www.domain.com:port/wp-content/xxxx. I know that’s the reason it can’t find the css file. But how could I fix it? Thanks a lot!!!