Home>Support>Widget Title Image- Mobile Responsive

Widget Title Image- Mobile Responsive

By Shawna Peryea, 7 years ago. Last reply by Alex S, 7 years ago.

Hi people,
I have been using the CSS editor to customize my new site and love everything about. The biggest points that are making me want to pull my hair out are the social media feeds on the alt home page. I am not sure if somewhere along the line I messed up the CSS, but I can’t for the life of me align the feeds horizontally with the custom widget backgrounds. I am still new at this so forgive me if I don’t post it correctly. :) I played with the margins and was able to move them how I liked, but not sure if in doing so it will mess up the mobile version! This is all the customization I have done and the last couple of lines are where I added the image backgrounds to the social media feed titles. My site is Caffeinated and Creative Thank you so much for any help! I am almost in tears because I am sooo close, yet so far from being done ha!

  border-width: 7px;
  background-color: #ffffff;
  border-color: #000000;
  border-style: double;
  font-size: 25px;
  font-family: Quicksand;
  color: #000000;
  text-align: center;
  margin-bottom: 15px;
}

.simple-social-icons ul li a {
  font-size: 30px;
  text-align: left;
  color: #000000;
}

.simple-social-icons ul.aligncenter {
  text-align: center;
  font-size: 24px;
  color: #000000;
  margin-top: 12px;
}

.sidebar.sidebar-primary.widget-area {
  margin-left: 2px;
  margin-right: -35px;
}

.widget ul.lastest_news li a {
  visibility: visible;
  font-size: 14px;
  font-weight: normal;
  font-family: Quicksand;
  text-transform: capitalize;
  text-align: center;
  color: #000000;
  background-color: #ffffff;
  margin-top: 15px;
}

#menu-top-menu.menu.genesis-nav-menu.menu-secondary.responsive-menu {
  background-color: #ffffff;
  border-width: 7px;
  border-color: #000000;
  border-style: double;
  padding-left: 75px;
  margin-top: 1px;
}

.wpcf7-form input[type="submit"]:hover {
  visibility: visible;
  color: #000000;
  text-align: center;
  padding: 12px;
  font-size: 23px;
}

.addtoany_share_save_container.addtoany_content_bottom {
  background-color: #ffffff;
  text-align: center;
  color: #000000;
  background-image: url("http://caffeinatedandcreative.com/wp-content/uploads/2017/06/Sharing1.png");
  padding-top: 100px;
  background-repeat: no-repeat;
  border-width: 7px;
  border-style: double;
  border-color: #000000;
  width: 300px;
  height: 160px;
  margin-left: 250px;
}

#submit.submit {
  text-align: center;
}

input[type=search] {
  color: #ffffff;
}

input[type="search"] {
  color: #050000;
}

input {
  color: #000000;
}

#simple-social-icons-10.widget.simple-social-icons {
  color: #000000;
}

.attachment-full.alignleft {
  margin-top: 35px;
  margin-left: 12px;
}

#text-48.widget.widget_text {
  margin-top: -200px;
  margin-left: 350px;
}

.list-full a.more-link:hover {
  font-style: normal;
}

.list-full a.more-link {
  font-style: normal;
}

.entry-time {
  font-size: 12px;
}

#archives-dropdown-3 {
  border-width: 7px;
  border-style: double;
  border-color: #ffffff;
  font-size: 14px;
  text-align: center;
  background-color: #5dd3bd;
}

select {
  text-align: left;
}

#archives-3.widget.widget_archive {
  background-color: #fcf9f9;
}

textarea {
  font-size: 16px;
  font-family: Quicksand;
  color: 000;
  border-width: 7px;
  border-style: double;
  border-color: #000000;
  background-color: fff;
}

.site-footer a {
  font-size: 12px;
  color: #000000;
}

a > img:hover {
  text-align: left;
}

.site-footer {
  font-size: 14px;
}

.wpcf7-form-control.wpcf7-textarea {
  background-color: #fff;
  border-color: #000000;
  border-style: double;
  border-width: 7px;
  color: #000000;
}

.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required {
  background-color: #fff;
  border-style: double;
  border-width: 7px;
  border-color: #000000;
  color: #000000;
}

.wpcf7-form-control.wpcf7-text {
  background-color: fff;
}

.wpcf7-form-control.wpcf7-text.wpcf7-email.wpcf7-validates-as-required.wpcf7-validates-as-email {
  color: #000000;
}

.wrap {
  text-align: center;
}

img {
  margin-left: 13px;
}

#comment {
  background-color: #fff;
  border-color: #000000;
  color: #000000;
}

.logged-in-as a {
  text-decoration: none;
  font-style: normal;
  font-size: 12px;
}

.simple-social-icons ul {
  color: #000000;
}

ul {
  color: #000000;
}

#simple-social-icons-8.widget.simple-social-icons {
  color: #000000;
}

.genesis-nav-menu {
  color: #000000;
  margin-top: -12px;
  background-color: fff;
}

span {
  font-size: 40px;
}

#widget_sp_image-23.widget.widget_sp_image {
  margin-top: -250px;
  margin-left: 280px;
}

#widget_sp_image-24.widget.widget_sp_image {
  margin-top: -250px;
  margin-left: -110px;
}

#widget_sp_image-22.widget.widget_sp_image {
  margin-top: -272px;
  margin-left: 865px;
}

.attachment-250x250 {
  border-width: 7px;
  border-style: double;
  border-color: #000000;
}

#gs_pin_profile_widget-3.widget.widget_gs_pin_profile_widget {
  background-image: url("http://caffeinatedandcreative.com/wp-content/uploads/2017/06/Pinterest-Feed.png");
  background-position: center bottom;
  background-repeat: no-repeat;
  height: 114px;
}

#fbw_id-3.widget.widget_fbw_id {
  background-image: url("http://caffeinatedandcreative.com/wp-content/uploads/2017/06/Facebook-Feed.png");
  background-position: center bottom;
  background-repeat: no-repeat;
  height: 114px;
}

#text-68.widget.widget_text {
  background-image: url("http://caffeinatedandcreative.com/wp-content/uploads/2017/06/Insta-Feed.png");
  background-position: center bottom;
  background-repeat: no-repeat;
  height: 114px;
}

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 7 years, 3 months ago Alex S
    Hi, I Work Here

    Hi Shawna,

    I’d like to help you with this issue. Unfortunately, this is beyond the scope of the support we’re able to offer on our free forums. There is a fair amount of custom work involved.

    We do offer this level of support to our premium users, so if you’d like to upgrade to SiteOrigin Premium, then I can help you over email support.

    If you’d prefer not to upgrade to SiteOrigin Premium, then you can hire a WordPress developer from Codeable. They’ll charge you an hourly rate for any work done.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More