Custom CSS for CD Cover/case shape

  • Posted in : BookCard
  • pixelgrease
    Participant
    21 March 2013 at 12:50
    #4612

    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
    21 March 2013 at 16:35
    #4617

    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
    22 March 2013 at 11:24
    #4649

    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
    25 March 2013 at 10:52
    #4724

    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
BookCard - 3D Folded vCard HTML Template
Login and Registration Log in · Register