roryjmurphy Posts - Answer Overflow

roryjmurphy

•Created by roryjmurphy on 2/1/2024 in #front-end

The Responsive Text CSS in Adobe Muse Affair

(I don't know why I have phrased like the title of a Tintin book). Hey There, I hope you are well? I am trying to figure out if I can use responsive text size within Adobe Muse. I am not sure what the class would be - in Muse there are Graphic Styles which are the CSS class. But there is also Paragraph Styles (like InDesign) which I am not sure would correspond to any CSS class. As a twist, I DL'd a Mucow file (Muse's developer files which can be dragged and dropped) which can do the responsive text - but with lots of drawbacks in terms of formatting. It is a fallback but limits the animation effect I use Having watched Kevin's 'min(), max(), and clamp() are CSS magic!' https://www.youtube.com/watch?v=U9VF-4euyRo&t=837s video I have tried to use that with a startling lack of success. CSS: .headingFadeLeft_01 { font-size: clamp(2rem, 5vw, 5rem) !important; } I am not sure if the class is correct - that is the paragraph style. I have 2 instances of the headline so I can implement a staggered animation effect (with a plugin). Currently working on this page of the site: https://roryjmurphy.com/its-not-custard.html The text does not scale at all... Any suggestions? Thanks in advance! R

17 replies

KPCKevin Powell - Community

•Created by roryjmurphy on 1/26/2024 in #back-end

CSS Sticky Mystery

Hey There, I hope you are well? I should point out I am not a coder at all - but i do know enough to be no bother whatsoever. I am trying to implement a Sticky element in my site which I have made with Adobe Muse (it is outdated, I know...). The CSS seems pretty straightforward and I did have something working in the past (I am also trying to find the old file) - with the caveat that it got pushed off by another element - even with the z-index high. I am trying again and am trying to remember the magic line of code that got it working in that instance. Here is what I have:

.CloseSticky {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 140px !important;
}

The !important tags are needed since it's Muse. I think. It seems to me that a sticky element should be very simple to implement however that doesn't seem to be the case here! As I said there was something I entered which worked - I can't remember what that was so would anybody be kind enough to point me in the right direction. I have a feeling I asked this here in the past but I can't find the entry - will keep looking. Cheers, R

48 replies

KPCKevin Powell - Community

•Created by roryjmurphy on 4/1/2023 in #front-end

Help With 100% Width and responsive CSS issue in Adobe Muse

Hello there, I am trying to create a rectangle shape in adobe Muse which I would like to span the width of the browser (which i have done) and be responsive (which I have done). The issue I am having is that the responsive scaling breaks for some reason. Is there a reason why? It work perfectly... then breaks and I can figure out why. I have implemented a 100% height code CSS which worked perfectly and converting height to width doesnt appear to function properly.The CSS I have used (or variation of this - 100% etc) is merely: <style> .fullWidthTest { width: 100vw !important; min-with: 0px !important; height: auto !important; } </style> (!important is something you hsve to use in Muse apparently to override the applications CSS, I know it's frowned upon). The issue is on the page below in the Showreel section at the bottom. https://www.roryjmurphy.com/about-rory.html Thank you in advance! I hope I have been clear enough.

4 replies

Gaming

Programming