FUCK CSS!

I spend more time positioning a single button than learning a frickin framework!

I gave up trying to make a div the same height as its parent. No clue why height:100%; doesn't work!

Because I struggle too,I don't remember the answer to your problem, but often, CSS rules only applies if the parent has fixed size (i.e 100px, but not % or undeclared) or if the div has content (like :before and :after needs 'content:"" ').
CSS is nice but can get really frustrating if you don't make daily activities with it. I may recommend you the app "Enki" that makes you regularly train some programming skills, including CSS (careful though, browser compatibility isn't always, or never, mentioned)

Is the padding on the parent set to 0 and the margin on the child 0? If you paste a link I can help.

I'd try:
min-height: 100%;
I'm not that experienced with CSS so its just a guess. 😅😂

You're using floats aren't you? 😀

Not 100% sure, but I think that for height to work properly in CSS all parents need to have the attribute as well (either just the parent with a px value, or everything with % values)

@Skipp no actually. I try to avoid them.

Ahh, these newer devs who were brought up on bootstrap, my sympathies to you, when I started deving there was not even a 3 after the CSS.

Now after many years of suffering, and some more thanks to that piece of shit bootstrap, I now get to enjoy flexibility, which makes what you suffering with, as easy as eating cake...

@reduxtris I managed to fix it after hard-coding some dimensions where I could without breaking the responsiveness (hopefully...).
Although I did make a simplified JSfiddle. If you can help, it'll be greatly appreciated.

https://jsfiddle.net/yaq3wvrs/1/
I'm trying to center the search bar and the "other stuff" vertically.

@RTRMS I can't imagine the hell you must've gone through each day.

@kamikaze996 if I were you I'd make the row class display: flex; then vertically center the content, give fixed widths to the search and other text, and make the logo fill the rest of the available space. (grow: 1; or something)
If not understandable I could probs make a jsfiddle or something in some hours.

I dream to of suicide? What?

@kamikaze996 it is only hell now that devs are used to easier ways or do not even truly know css, for us old souls, this was normal. Bootstrap is hell.

@jonatan just remember, as good as felxbix is, support is still a bit of an issue, only edge supports it so if ie is of any concern, then you SOL.

Height 100% certainly does work with position relative however I would recommend 100vh over 100%

@Strannch awesome recommendation i do CSS since a couple of years but still learned new things from Enki.

@jonatan Thanks a lot! Worked beautifully!

@kamikaze996 any time fellow devranter

@RTRMS agreed. I personally prefer to avoid flexbox because it is not fully supported, but on the other hand, those fucks that don't upgrade their websites don't deserve to view my fabulous websites. (No offence, or maybe a little)

#search-bar-form {margin-top:15px;}
Comment out all that flex rubbish.

@RTRMS my mate taught me. But i was banned from using bootstrap for 3 months. Made me remake the whole yahoo css. Now i code react bootstrap ;) added with a li rary called styled component. Css almost unused ;)