Custom CSS for CD Cover/case shape

  • Posted in : BookCard
  • pixelgrease
    Participant

    Hello,

    I’d like to alter the shape of the card slightly to resemble a CD cover/case. Can this be done entirely with CSS or will I need to edit other parts of the code?

    The width is currently fine at 770px, but the height needs to be reduced to 700px on all pages.

    Thanks!

    PG

    ahmetsali
    Keymaster

    Hi, try the custom css code below, and see if it is what you want;

    @media screen and (min-width: 979px) { 
      html:not(.safe-mod) .rm-wrapper, html:not(.safe-mod) .rm-wrapper > div { max-height: 400px; }
      html:not(.safe-mod) .rm-wrapper { top: 90px; }
    }
    
    @media screen and (min-width: 1500px) { 
      html:not(.safe-mod) .rm-wrapper, html:not(.safe-mod) .rm-wrapper > div { max-height: 480px; }
    }
    
    pixelgrease
    Participant

    Yes, that’s perfect in Chrome and browsers supporting the effects, thank you!

    However, in older browsers the “front page” is still rectangular ..

    PG

    ahmetsali
    Keymaster

    Also try this custom css for standart layout;

    .safe-mod.on-cover-page .rm-wrapper { top: 60px; max-height: 520px; }
    @media screen and (min-height: 900px) and (min-width: 1400px) {
    	.safe-mod.on-cover-page .rm-wrapper { top: 100px; max-height: 640px;}	
    }
    @media screen and (max-height: 480px) and (max-width: 320px) {
    	.safe-mod.on-cover-page .rm-wrapper { max-height: 300px;}
    }
    
Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in and have valid license to reply to this topic.

License required for the following item
Login and Registration Log in · Register