I would like to know why when resizing the page in the preview view port, why do the logo’s on the left in the ‘rockets’ section end up going behind the h3 header and the paragraphs that are beside the logo?
You have to post your code somewhere like on codepen in order for the code to be reviewed.
Does that work for you?
Just so you know I am aware that I could create a media query to hide the logo’s, but I would like to know why the logos are being pushed behind the text headers and text elements? Just trying to understand what is going on here? Is it doing this because the image is a block element and the header and p elements are inline? I did change it all to display flex!
question for you, which element is meant to have id=“falcon-9-logo” ?
There seems to be more than one with this id so it may be messing up the css.
Yes good eye! The id=“falcon-9-logo” was in 2 places and I made the correction already.
Under the class=“falcon-heavy” I changed the img id from “falcon-9-logo” to “falcon-heavy-logo”. Thanks for pointing that out.
However that doesn’t fix the overlay problem.
I found that if I set a min-width on your div .falcon-9 it stops the other div from overlapping it on smaller screens.
Unfortunately I don’t know why the situation is happening to begin with.
Do you mean use a media query?
If I set a larger padding-left to the element this stops the text overlay as well! It is unfortunate that neither of us can figure out what is going on here.
I thank you for your time and effort in helping me out!
No. Not sure what you are referring to?
Oh I meant using a media query on the .falcon-9 div to set a min-width.
I didn’t do that. I just set it.
Ok I understand. Well Thanks again for your time and patience. You have a nice evening 
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.