Padding Within Front Page 1

[agoodwin90]

Hi Everyone,

I need to make a very specific CSS change within my Altitude Pro site and I'm having a hard time figuring out how.

Within the @media only screen and (max-width: 1200px), I need to change the "padding-top" of .flexible-widgets ONLY within front-page-1. The problem is that I have a white font color for my Front Page 1 header and part of the background image is white. The only time the header ends up on top of the white part of the picture is within this media query.

I've tried making CSS changes within @media only screen and (max-width: 1200px), but nothing has worked yet. Any help would be much appreciated!

Thanks

http://wordpress-10404-24978-78098.cloudwaysapps.com/

[Doug Edgington]

I am not seeing the text overlapping a white area within front-page-1. But the white text in front-page-7 appears to overlap a white area in responsive mode. Rather than trying to move the text away from the white area, you could just change the entire background to a solid color. An example is below.

media only screen and (max-width: 1023px) {
     .front-page-7 { 
          background: #9e9fa3!important; 
     }
}

---

Doug Edgington
http://www.dougedgington.com

[agoodwin90]

Doug,

Thanks for your reply. I realized that the problem was within (max width: 1280), not (max width: 1200). Once I figured that out, I added this to the CSS file and it fixed the problem:

@media only screen and (max-width: 1280px){
.front-page-1 .flexible-widgets{
		padding-top: 0px;
	}
}

Now to tackle the issue you mentioned in front-page-7. Good idea to change the background color. I'll start experimenting.

[Doug Edgington]

Okay. So it was already fixed when I seen it. Glad you figured it out.

---

Doug Edgington
http://www.dougedgington.com

[Doug Edgington]

By the way, I just realized my example snippet is missing the @ symbol in front of the media query.

---

Doug Edgington
http://www.dougedgington.com

[Author]

Posts