Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Rebecca Jasso
Rebecca Jasso
3,243 Points

My site looks terrible in Safari.

My layout is all good in every browser except Safari. I made a grid-based layout and my right column is partially off-screen and all the way to the left. I validated my CSS and my HTML, and as far as I can tell, I have no errors.

I had this problem on a website I made in another class, but figured it would all make sense eventually.

My site is already online at hardingguitar.com

Please help!

1 Answer

At least on all your subpages I'm pretty sure your issue is related to the fact that you have all of your P tags wrapped in an H3 tag with the content class applied to it, for example:

              <h3 class="content">
              <span class="name">Patrick Harding</span> is a Chicago-based musician who began his study in music in his early twenties. He completed a Bachelor of Science degree in Music Business from Huntington University, where he completed internships (including one at Sweetwater Recording Studios) and fully intended to segue into the music industry. Instead of pursuing his planned path, he continued on and achieved his Masters in Classical Guitar, studying with guitar virtuoso Fareed Haque at Northern Illinois University. </p>

<p>Patrick has played in many settings, and has achieved many accolades. He performed in Huntington University's Longaker Honors Recital twice in his time there, and he was also a winner of the 2010 Concerto Competition. He performed Vivaldi's "Concerto in D, RV 93" with their orchestra in Spring 2010. He was awarded the departmental award for outstanding senior in his final year there.</p>

<p>While at Northern Illinois University, Patrick was awarded a graduate assistantship, and completed his degree with highest honor. He was chosen for the Honors Recital in his final semester there. He also was selected to debut Doug Merar's "Contrasts," a piece commissioned in 2010 by violist David Lee.</p>

<p>Patrick has a strong interest in teaching. He has taught lessons for the majority of his playing career, and recently acquired his Suzuki Guitar certification at the Book 1 level. To do so, he was awarded the prestigious Frank Longay Scholarship.</p>

<p>Patrick loves to play for all kinds of events events. He has played for dozens of weddings and receptions, social hours, and concerts for various groups, including retirement homes. He has also played for the openings of coffee houses, art galleries, and has done private shows in the Chicago area.</p>

<p>Patrick now resides in Wicker Park with his wife and is employed at the Old Town School Music Store. He continues to study the guitar with Denis Azabagic, a world-renowned guitarist and the head of the guitar program at Roosevelt Conservatory.</p>

<p>His repertoire includes music from the Renaissance, Baroque and Classical periods, as well as a plethora of Spanish, South American, Latin American, and contemporary music. Whatever event you might be planning, Patrick Harding will have the right music for you.</p></h3>

In your stylesheet, the content class has a margin-left of -150px.

Can you try removing that H3 with the class of content wrapping all your P tags and see if that addresses the issue?

For the home page, what grid framework are you using for this? I'm wondering why you have an empty div with col-3 applied, seems unnecessary, you should likely only be applying column classes to divs that contain content.