@khaduch i've been considering trying to learn how flex works to incorporate flex into future projects, but i figured i'd at least finish this series of projects before embarking on something new haha. but yes, if it can be done in flex, happy to learn! @TylerMoeller awesome! let me know :)

Tyler Moeller

@TylerMoeller

@bethqiang Add the classes responsive-img circle to your <img> tags in your JS. Remove the height and width settings from your CSS for the class .logo-style, and then add a top margin to get them vertically aligned.

You can set a min-width on the image as well to keep it from getting too small at certain media sizes

Beth Qiang

@bethqiang

@TylerMoeller hmm ok cool, most of that worked--is there any way to auto set the top margin so that it's always vcentered, regardless of the size? for example, the way i have it now (set to 25%), it's okay at some screen widths but really really not in others

Ken Haduch

@khaduch

@bethqiang - I'm close to getting the flex thing working - if I set the height of the flex div to 200px - it looks nice! I'll post a screenshot

Tyler Moeller

@TylerMoeller

@bethqiang You could do something like this:

.logo-style{
margin:15px auto 0 auto;
min-width:80px;
}

Flex also works well with materialize.

Ken Haduch

@khaduch

@bethqiang - that's for the offline users. I need to figure out how to get the thing automatically to set the height to the container div? Not sure about that one.

Beth Qiang

@bethqiang

@TylerMoeller - still not quite what i was envisioning, but def closer...hmm.@khaduch - that does look awesome! what is the "thing" you're referring to?

Rich

@richard-ball

Is there some default behaviour that blocks the use of the submit event, since I cannot get it to work. all that happens is my console clears and the text input empties.

Ken Haduch

@khaduch

@bethqiang - I have added a div to hold the image, but if I do not specify a height, it does not inherit the height of the parent div, the "row", so it ends up just looking as it did before. If I set the height with a hard-coded value, looks like about 106px works, then it is vertically centered, thanks to the flex settings... still researching.

i’m slightly confused about the twitchtv project - is the point just to pull & display the list of current streamers?

Tyler Moeller

@TylerMoeller

@Travmatth Yes, and filter that list by their online/offline/closed account status.

Beth Qiang

@bethqiang

@khaduch - would setting the height to 100% do anything?

Anshul Jain

@ajain706

hello world !!!!!!!!

CamperBot

@camperbot

welcome to FreeCodeCamp @ajain706!

Stephen James

@sjames1958gm

@ajain706 HEELLOOO

Anshul Jain

@ajain706

hy @sjames1958gm

Ken Haduch

@khaduch

@bethqiang - I just figured it out - I needed to make the parent contaner also be a flex container. I'll just fork your project for you to check out - the changes that I made are only for the offline users, there was change to the offlineHTML, and the addition of a .flexCenter class, as well as adding display:flex; to the .offline class. Here is a link - see if you get it working. I think that you had an error in your original HTML, maybe missing a closing </div> tag? Anyway, I think that the offline users is working here.

Beth Qiang

@bethqiang

@khaduch - awesome, i'll take a look at it! i wouldn't be surprised if i had an error in my original HTML...i find it so difficult to keep track of closing tags. :/ and @TylerMoeller - thanks to both of you for taking a shot at it!

does document.ready() only fire the first time the DOM is loaded, or also after your scripts complete changes to the DOM?

Angel Eduardo

@angelfeliz

@marcvesper in my expirence is only once. when the DOM is ready //executes when HTML-Document is loaded and DOM is ready , there is a document.load() //// executes when complete page is fully loaded, including all frames, objects and images

Muhammad Hasham

@MohammadHasham

any good resource i.e; video tutorials or anything to learn AJAX actually i know how to ue getJSON but not AJAX,

Where can I buy two quality 4GB RAMs at a reasonable price, for my MacBook Pro 13’’ Mid-2009?

Ken Haduch

@khaduch

@bethqiang

@khaduch - so i looked up a couple of things relating to the flexbox class that you added in, and found this on mdn -/ Pack items around the center /justify-content: center;

I think that is horizontal centering, so it might not be needed here, since the width of the image probably determines the width of the div?

Beth Qiang

@bethqiang

@khaduch ah, right, now that i'm reading the description again, that makes sense!

Ken Haduch

@khaduch

@bethqiang - if you split your HTML strings into separate lines, as I did (because I needed to try and give myself some level of understanding of what you were generating and how I wanted to change it) that makes it easier to read.

Beth Qiang

@bethqiang

@khaduch yeah, i really liked that and will definitely continue doing that, it makes it sooo much easier

Don Price

@KingHippo

Has anyone here worked with React JS and knows of a good tutorial or book?