Jump to content


  • Content Count

  • Joined

  • Last visited

Community Reputation

0 Neutral

About absolutebeginner

  • Rank
  1. Thanks dsonesuk. I'll give it a shot.
  2. Thanks dsonesuk. Could you show a newbie how it's done?
  3. Hmm, seems I jumped the gun. The $(document).ready(function() part seemed to create issues with certain browsers. I removed it and added the $("#col1 ~ 3").css("height","auto"); lines at the beginning of the resize event. It appears to have another advantage in making responsive code for small screens unnecessary. Still testing, but looking good so far. $(window).resize(function(){ $("#col1").css("height","auto"); $("#col2").css("height","auto"); $("#col3").css("h
  4. I appear to have solved this, almost. Due to word length vs column height, it's always the first card's div or the second card's div that has more height. After giving them ids of "col1", "col2" and "col3", I use the below jQuery. I guess that a better solution to is to loop through each of them, but I'm not at that level yet. I'm also using the resize event, for when I manually adjust the browser width. Note that it's not perfect, I get some weird overflow at certain resolutions. Also see the issue when rotating devices to "portrait" mode. // Equalise card heights
  5. Hi everyone, I borrowed part of the Marketing / Website Template (W3.CSS), specifically the <!-- Work Row --> portion. It looks fantastic, but according to the device browser, (specifically phones and tablets) when in "landscape" mode, the "w3-card" divs have different height according to the text. I've been trying for days to find a solution - flexbox, w3-cell, pseudo-elements - mostly way above my understanding, and nothing has worked so far. Wouldn't be surprising if I've found a valid solution and mucked it up because of my inexperience Anyway, here's the code fro
  6. I worked out how to it using some jQuery. Don't know if it's good practice to mix (regular?) Javascript and jQuery, but here's how I did it. (You guys probably do this better in your sleep) In the button tags, I added IDs named the same as the div IDs, but with "_btn" on the end. The Javascript/jQuery code is this (using a link to google.apis at the top for the jQuery, jQuery code is shown in blue) function Accordion(id) { var x = document.getElementById(id); if (x.className.indexOf("w3-show") == -1) { x.class
  7. I have some W3.CSS accordions on a webpage based on this tutorial. They work fine, but I'd like to change the button text too (not just show/hide the div) When shown, I'd like the button to show "Click for details". When hidden, I'd like the button to show "Hide details". Thanks in advance for any assistance/advice you can give me.
  8. To reply to my own question, I see the Band template in W3.CSS section has both these features, so I'll dig into the code and see what I come up with.
  9. Hi Everyone, First of all, w3Schools is an incredible resource. I was able to find code for Sticky Top Navigation and Responsive Top Navigation. Sticky Top Navigation https://www.w3schools.com/howto/howto_js_navbar_sticky.asp Responsive Top Navigation https://www.w3schools.com/howto/howto_js_topnav_responsive.asp But what I really want is both. Is it possible? Also, I don't know if this is wise, but I'm trying to W3.CSS (which I just discovered) but I settle for anything that works. On a related note, in CSS, what do some styles use "." and some use
  • Create New...