I'm struggling with trying to make my divisions all have the same height (equal to the height of the largest division as I change the window size and text wraps). I tried using stackoverflow.com/questions/2313140/… but I can't seem to get it to work. This is the page that I am building enviroptics.com/temperaturesensorstest.html - And I am trying to get the red, green and blue boxes to be the same height.
For reference, in the page source code (at least in chrome, idk if it changes by browser) the script is lines 783 to 788, and the HTML is 671 to 695. If anyone could point me in the right direction I'd appreciate it =/
If you're comfortable using JS (something like this can be done CSS, it's just kind of a pain) then you need to include jQuery (using your current approach anyway - it's 100% possible without jQuery, just would have to change the code), give vertical-align: top; to each of them, then make sure you change the height on page resize as well as on page load
for future reference, demos can be even more minimal than that by removing all of the fluff that's not related to the issue
Ive actually never really used JS, but just knowing what I'm supposed to research would help. I gave the class verical-align: top; So just to clarify I should be looking into how to make the javascript run when I resize the page and also when I load the page?
Also, sure sorry about that, next time i'll cut out the excess stuff
In jQuery you can fire a function on resize by doing $(window).on('resize', function() { ... }); (or putting a function name there instead of making a new one)
You can right click the page and click "Inspect". That will open up the developer tools. Then you can go to the tab named "Console" and it will show you errors that your script has
On your demo that says, "Uncaught ReferenceError: $ is not defined", which means that jQuery has not been imported in this case
Don't worry about that. JSFiddle has some irrelevant errors every time you refresh the page
in order to get it to work when the page is first ran, I'd likely put the code you want to run inside of a named function (so like function sizeContainers() { ... } ) and then call that inside of the resize event handler and also call it when you declare the event handler
@MatthewSirkin the content does, but the container's height is already set (because you set it previously). So it doesn't respond to the content height any longer
ah, i can see what you mean, if i run it while the content is squished and i resize the windows, all the containers are large, and if I rerun it when the content is stretched out they stay small when i resize the window
@Alesana I would much rather have Windows 7 than XP. In fact I'd much rather have Windows 10 than 7 if it weren't for the lack of control over the OS in Windows 10
just wondering if someone might know.. it has been on alpha version for a while.. and i'm thinking of using it unless someone has a different recommendation
mark my words, if ad-blockers aren't made illegal there will some day be a netflix type model of browsing the net. Websites will opt-in to the model and no one can browse their site unless they are a paying customer.
lol, I love SO. My coworker like 6 feet away asked me how to do something in CSS because he couldn't find the answer on Google and I just linked him to one of my answers
Got to love people down voting my question as lacking specificity even though I've provided the answer with an example. stackoverflow.com/questions/43547430/…
Questions with an instant answer (or where author answered the question) should get some special flag.
> Questions seeking debugging help ("why isn't this code working?") must include the desired behavior, a specific problem or error and the shortest code necessary to reproduce it in the question itself. Questions without a clear problem statement are not useful to other readers. See: How to create a Minimal, Complete, and Verifiable example.
@Loktar Sorry, I was hoping it is going to allow me to provide additional information when flagging (first time flagging someone in chat). @ZachSaucier is clearly in the wrong here, and campaigning other people to cv-pls based on personal stink is not acceptable behaviour.
@Ryan How are the elements positioned? Are they siblings to each other? Are they even DOM elements? Should the "hidden" elements be hidden from the DOM or just visually hidden? These are some of the many aspects that are lacking in the question — Zach Saucier3 mins ago
When does a function normally get executed? If there's a way to call it onload, then it must not normally get called when the page loads, right? So when does sizeContainers(); this function execute if I just put it in a script tag?
my html file is of the format <head> <style> [stuff] </style> </head> <body> [content] <script> [definition of function sizeContainers();] sizeContainers(); </script> </body>
The question How to hide the entire element if part of the element overflows vertically? was closed by 5 members of the community. It was then reopened by a moderator. Here is an image of the question as it was closed in and now stands:
I believe that this question is too broad and unclear bec...
This question belies an existing issue with the Q&A system on Stack Overflow: the self-answer. When this option is checked, you can create a Question and an Answer at the same time, as a way of showcasing the solution to an issue or question you just dealt with, and want to share:
Gajus used t...
@Gajus FWIW I do sympathize with you as I have dealt with this same problem on a Q&A self-answer of my own years ago. Best bet in the future is to follow meta.stackoverflow.com/questions/314165/…