Welcome to Code Forum!

Join a community that supports you and your coding journey from day one. We strive to be a friendly, supportive community that empowers everyone to be better developers. By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!

Search results

  1. tomliv

    animation changes position

    Is this the only HTML on your page?
  2. tomliv

    Problems with footer styling

    This really isn't enough info. Do you have a link to look at? I will recommend that the <p> be outside the <a> and the columns can be handled differently, but that's not really the issue I suspect.
  3. tomliv

    How to remove gaps?

    You can try incorporating one of the following: grid-auto-flow: dense; grid-auto-flow: row dense; grid-auto-flow: column dense; HOWEVER, tab order will be wrong visually, if that matters in your case.
  4. tomliv

    Menu

    This is your issue: transform: translateX(-320px); on #site-navigation
  5. tomliv

    CSSZengarden Sticky Earth Animation

    Remove perspective and perspective-origin on body. Change globe to position:fixed and animation-iteration-count to infinite. Is that what you are looking for? You said you wanted it to scroll up and down with the page. It already does that.
  6. tomliv

    Navigation bar divs shrinking and scaling with changing window size.

    You'll have to adjust the font size and spacing so as to have your menu items on a single line. Switching to a mobile "hamburger" menu on mobile is somewhat complicated. At a certain breakpoint (@media) you would switch the styles to change the layout of your menu, hide it from view (initially)...
  7. tomliv

    Responsive div box with background, overlay, and image

    Adjust as needed: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .wrapper{ position: relative; width: 80vw; height...
  8. tomliv

    Can someone replicate this exact animation that is on this website?

    I assume you mean the Spotify code. I have a feeling that the animation is coming from a different source such as a script, in which case you'd need to parse through a lot of js (i assume) to find the relevant parts. I am not saying the code I did is from the sample page. I just researched a...
  9. tomliv

    Can someone replicate this exact animation that is on this website?

    .wrapper{ border: 1px solid #000; position: relative; width: 800px; height: 600px; overflow: hidden; } .item{ position: absolute; background-color: red; width: 200%...
  10. tomliv

    dropdown menu disappearing ?

    I'd suggest not using hover to open the menu. From an accessibility stand point, it's better to open menu with click.
  11. tomliv

    iphone browsers jumbling html and css output

    I'd need more than this. Do you have a link? Do you have the html and css for the page?
  12. tomliv

    Navigation bar divs shrinking and scaling with changing window size.

    Trying to understand you. Are you looking to have each menu item on it's own line, or all of the menu items on a single line?
  13. tomliv

    Problem with footer width

    If this isn't a dupe of another thread, do you have a link to the page you can share?
  14. tomliv

    Better way to scale than vw

    I use this tool frequently: https://royalfig.github.io/fluid-typography-calculator/ After putting in the parameters you want, it will create a font-size declaration that will scale fonts but with a min and max size so the font size won't get too small or too large.
  15. tomliv

    The color rule I coded in CSS doesn't go the same with HTML

    "!important" should be used as a last resort. You should be using the class name like Malcolm showed: .text-primary { color: var(--primary); } and the value "var(--primary)" is defined earlier in your css: :root{ --primary: #808080; } Then to apply that style to text, add the class to your...
  16. tomliv

    CSS Within HTML Code

    @Malcolm is correct, naturally, however I will add that there is a school of thought that suggests using internal css for the elements on a page that are likely to be in the viewport upon page load (without scrolling) as a performance enhancement. The idea being that internal css loads faster...
  17. tomliv

    HTML & CSS jQuery Generated Variable Not Passing to CSS Keyframe Animation on Safari

    You don't seem to be defining an animation for .two
  18. tomliv

    Bold not showing for some people

    Also, I would suggest an extension to help you identify what font is rendering, like: https://chromewebstore.google.com/detail/whatfont/jabopobgcpjmedljpbcaablpmlmfcogm Also available for Firefox and Safari
  19. tomliv

    HTML & CSS Ideas For Gaming Website

    I use VS Code with Github Copilot extension. Not sure if the cost is similar to PerplexityAI.
Back
Top Bottom