HTML Help Please

  • tgwebdesign

    (@tgwebdesign)


    9 years ago

    Hello,

    Im trying to figure out how to widen the area that contains the thumbnail images on my homepage: http://nnbaconference.com/

    My goal is add padding in between each headshot. For example, when I try to add space in between LeAnn Thieman and Louise Jakubik, Sean Dent gets pushed down to the second row. I want to add space in between these images for every row without the 3rd image dropping down to the next row. I used the inspector in chrome and from my understanding, the area is: div.entry-content

    I then scrolled down to the very bottom of the inspector and found the boxes that deal with padding on the page. I changed 644×2057 to 1000×2057 and the right padding for this area increased which leads me to believe that if I try and add spacing in between the headshot images, Sean Dent wont drop to the next row. However, Im not sure how to do this in the style.css stylesheet. Is this where im supposed to be making the change?

    Any help would be greatly appreciated. Thanks!

Viewing 5 replies - 1 through 5 (of 5 total)
  • Poonam Namdev

    (@poonam9)

    9 years ago

    Hello there,

    Increase your content area with the below CSS. Add the following custom CSS to customize-> Additional CSS

    @media screen and (min-width: 30em){
.page-one-column .panel-content .wrap {
    max-width: 960px;
}
}

    Now you can increase the space between the each headshot.

    .wp-caption{
margin-right: 7.5em;
}

    Let us know if you need help with anything else!

    Thread Starter tgwebdesign

    (@tgwebdesign)

    9 years ago

    Thank you very much! That worked!

    Poonam Namdev

    (@poonam9)

    9 years ago

    Glad I could help.Please mark the thread as resolved.

    Thread Starter tgwebdesign

    (@tgwebdesign)

    9 years ago

    Hi Poonam,

    One additional request if possible please. I am now trying to center the following items:

    -The countdown timer
    -“Meet your speakers”
    -“Click on each speaker to learn more”
    -Headshots

    Currently, they’re pushed over to the left. I would like for them to be centered on the page just like the “register now” link is as well as every other section on the page. I tried adding “padding-left” to the above code that you provided but then that also pushes the other sections of the website to the left when all I need is for the above items to be edited/centered. Is “padding-left” the incorrect property to use?

    I hope Im making sense. I would greatly appreciate the assistance

    Thank you!

    Thread Starter tgwebdesign

    (@tgwebdesign)

    9 years ago

    Can anyone help with this please? Essentially, I would like to center all elements in the first “entry-content” div on the page and not affect the other “entry-contents”.

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘HTML Help Please’ is closed to new replies.