Click here to Skip to main content
15,946,316 members

The Weird and The Wonderful

   

The Weird and The Wonderful forum is a place to post Coding Horrors, Worst Practices, and the occasional flash of brilliance.

We all come across code that simply boggles the mind. Lazy kludges, embarrassing mistakes, horrid workarounds and developers just not quite getting it. And then somedays we come across - or write - the truly sublime.

Post your Best, your worst, and your most interesting. But please - no programming questions . This forum is purely for amusement and discussions on code snippets. All actual programming questions will be removed.

 
GeneralCSS & Sophocles, more related than you know Pin
raddevus22-Jul-24 12:22
mvaraddevus22-Jul-24 12:22 
While working on a SPA I had some CSS that I was applying on the click of a button.
When the button was clicked, it would make one or the other DIVs go fullscreen (except for a small portion at the top where the nav bar was).

Imagine you have these two divs -- one yellow and one cyan;
CSS
#first{
  background: yellow;
}

#second{
  background: cyan;
}
Then when you click a button in the navbar it would make one or the other go fullscreen by applying a fullscreen CSS class.
It worked great & I was very happy with the simplicity of it all.
If you really want to see it work (toggle), take a look at this simple jsfiddle[^].
CSS
.fullScreen{
  width: 100%;
  height: 90%;
  z-index: 20;
  position: absolute;
  top: 12%;
  padding: 10pt;
}
Here's the button click code.
JavaScript
// select the div and add the style
document.querySelector("#first").classList.add("fullScreen");
// remove style from other div so it isn't fullscreen
document.querySelector("#second").classList.remove("fullScreen");
// vice versa for the other div -- not showing all the toggle code
It Worked, Then Didn't!
It was all working. I copied the code to another project and had it all set up.
But suddenly clicking the button wouldn't do the fullscreen. I tried all manner of things.
Was the button click working? I added an alert() and saw the button was working.
I was going out of my bleedin' mind.
Then I looked real hard at the styles that I had copied to the new project.
Can You See It?
Do you see the problem?

CSS
#first{
  background: yellow;
}

#second{
  background: cyan;
};

.fullScreen{
  width: 100%;
  height: 90%;
  z-index: 20;
  position: absolute;
  top: 12%;
  padding: 10pt;
}

Oy!! I have only myself to blame.
As Sophocles said:
The keenest sorrow is to recognize ourselves as the sole cause of all our adversities.

Sophocles was obviously a software developer.
GeneralRe: CSS & Sophocles, more related than you know Pin
Jeremy Falcon22-Jul-24 14:19
professionalJeremy Falcon22-Jul-24 14:19 
GeneralRe: CSS & Sophocles, more related than you know Pin
raddevus22hrs 57mins ago
mvaraddevus22hrs 57mins ago 
GeneralRe: CSS & Sophocles, more related than you know Pin
Jeremy Falcon18hrs 54mins ago
professionalJeremy Falcon18hrs 54mins ago 
GeneralRe: CSS & Sophocles, more related than you know Pin
Jeremy Falcon18hrs 39mins ago
professionalJeremy Falcon18hrs 39mins ago 
GeneralRe: CSS & Sophocles, more related than you know Pin
raddevus18hrs 25mins ago
mvaraddevus18hrs 25mins ago 
GeneralRe: CSS & Sophocles, more related than you know Pin
Jeremy Falcon16hrs 28mins ago
professionalJeremy Falcon16hrs 28mins ago 
GeneralRe: CSS & Sophocles, more related than you know Pin
RickZeeland22-Jul-24 19:13
mveRickZeeland22-Jul-24 19:13 
AnswerRe: CSS & Sophocles, more related than you know Pin
raddevus22hrs 58mins ago
mvaraddevus22hrs 58mins ago 
GeneralRe: CSS & Sophocles, more related than you know Pin
Jeremy Falcon18hrs 51mins ago
professionalJeremy Falcon18hrs 51mins ago 
JokeRe: CSS & Sophocles, more related than you know Pin
Peter_in_278022-Jul-24 20:27
professionalPeter_in_278022-Jul-24 20:27 
GeneralRe: CSS & Sophocles, more related than you know Pin
TNCaver15hrs 19mins ago
TNCaver15hrs 19mins ago 
GeneralRe: CSS & Sophocles, more related than you know Pin
Richard Deeming4hrs 16mins ago
mveRichard Deeming4hrs 16mins ago 
GeneralLinux C PreProcessor: Who Knew? Pin
raddevus4-Jul-24 6:26
mvaraddevus4-Jul-24 6:26 
GeneralRe: Linux C PreProcessor: Who Knew? Pin
trønderen4-Jul-24 8:22
trønderen4-Jul-24 8:22 
GeneralRe: Linux C PreProcessor: Who Knew? Pin
Jalapeno Bob4-Jul-24 9:46
professionalJalapeno Bob4-Jul-24 9:46 
GeneralRe: Linux C PreProcessor: Who Knew? Pin
raddevus4-Jul-24 10:14
mvaraddevus4-Jul-24 10:14 
GeneralRe: Linux C PreProcessor: Who Knew? Pin
Dave Kreskowiak4-Jul-24 9:37
mveDave Kreskowiak4-Jul-24 9:37 
GeneralRe: Linux C PreProcessor: Who Knew? Pin
raddevus4-Jul-24 10:16
mvaraddevus4-Jul-24 10:16 
GeneralRe: Linux C PreProcessor: Who Knew? Pin
k50549-Jul-24 3:51
mvek50549-Jul-24 3:51 
GeneralRe: Linux C PreProcessor: Who Knew? Pin
raddevus9-Jul-24 4:51
mvaraddevus9-Jul-24 4:51 
GeneralDoes this scare anyone else? Pin
honey the codewitch4-Jul-24 0:44
mvahoney the codewitch4-Jul-24 0:44 
GeneralRe: Does this scare anyone else? Pin
Peter_in_27804-Jul-24 11:33
professionalPeter_in_27804-Jul-24 11:33 
GeneralRe: Does this scare anyone else? Pin
honey the codewitch4-Jul-24 11:35
mvahoney the codewitch4-Jul-24 11:35 
GeneralWhat the hell GCC, again Pin
k50542-Jul-24 11:32
mvek50542-Jul-24 11:32 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.