• Using a child version of the Customizr theme… need to override the default text align settings in the 3 footer widgets to all align flush left.

Viewing 9 replies - 1 through 9 (of 9 total)
  • Ben Meredith

    (@benmeredithgmailcom)

    can you post a link to the site and I’ll have a look?

    If not, try this:

    .YOURDIVCLASS {text-align: left !important;}

    Though it’s not best to use !important declarations all willy-nilly. Seek to understand the CSS!

    But seriously, just give us a link and I’ll check it out.

    Thread Starter brivell567

    (@brivell567)

    Thanks for the response. I certainly wish I could post a link, but I’m setup on a local server. I need to override the current Customizer css, but I’m not sure which one it is in the many lines of code styles from the original file that specifically deal with the text widgets of the footer.

    Ben Meredith

    (@benmeredithgmailcom)

    hmm.

    In the demo site for Customizr, the three footer widgets have div classes of “widget” and different IDs depending on which widget is being used.

    the ids of the demo site at http://demo.themesandco.com/ are “recent-posts-3” “recent-comments-3” and “search-3”

    Can you find those divs in the CSS?

    Thread Starter brivell567

    (@brivell567)

    This is the footer code from a preview of the site showing the text widgets that I’ve used. I have a Twitter widget on the left footer widget, which is fine; a text widget in the center that I want to adjust; and an event list widget in the right that I’d like to adjust.

    <footer id=”footer”>
    <div class=”container footer-widgets”>
    <div class=”row widget-area” role=”complementary”>
    <div class=”span4″>
    <aside id=”wdtwitterfeed-2″ class=”widget WDTwitterFeed”>Tweets by @RoosterRescues
    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?’http’:’https’;if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+”://platform.twitter.com/widgets.js”;fjs.parentNode.insertBefore(js,fjs);}}(document,”script”,”twitter-wjs”);</script>
    </aside>
    </div>
    <div class=”span4″>
    <aside id=”text-5″ class=”widget widget_text”><h3 class=”widget-title”>Rooster to the Rescue…</h3>
    <div class=”textwidget”><p>was founded in October of 2012 immediately before Rooster’s passing. We have focused our efforts in the counties surrounding Jacksonville, Florida which do not receive as much funding or help as compared to larger city shelters. It is our ultimate goal to establish Rooster to the Rescue chapters in each state resulting in a national effort to educate the public about this disease and ensure no dog dies due to lack of funding, treatment or failure to administer prevention.
    Members of the Rooster to the Rescue team are fun and dynamic individuals who are committed to helping animals in need and raising awareness about heartworm disease, prevention and treatment. Contact us today to learn more.</p>
    </div>
    </aside>
    </div>

    <div class=”span4″>
    <aside id=”event_list_widget-2″ class=”widget widget_event_list_widget”><h3 class=”widget-title”>Upcoming events</h3>
    <div class=”event-list”>
    <ul class=”event-list-view”>
    <li class=”event”>
    <div class=”event-date”><div class=”start-date”><div class=”event-weekday”>Fri</div><div class=”event-day”>25</div><div class=”event-month”>Oct</div><div class=”event-year”>2013</div></div></div>
    <div class=”event-info single-day”><h3>1st Anniversary Bash</h3><span class=”event-time”>6:30 pm</span><span class=”event-location”>Seven Bridges Grille & Brewery</span></div>

    </div><div style=”clear:both”>Link to event</div></aside></div>

    </div><!– .row widget-area –>
    </div><!–.footer-widgets –>

    Now, I’ve played with a few of the corresponding css listings a few days back for span4, text-5, footer widgets… and nothing worked. I’m kind of stumped.

    Ben Meredith

    (@benmeredithgmailcom)

    The div ids you want to modify in the css are #text-5 and #event_list_widget-2

    In your CSS file, do you see those selectors?

    I’ve got to run, but I’ll check back later to see if you get it.

    Hey there,

    This worked for me (www.worldatplay.org.uk):

    footer#footer p {
    text-align: left;
    }

    footer#footer h3 {
    text-align: left;
    }

    Cheers

    Sion

    Thread Starter brivell567

    (@brivell567)

    Hi Ben,

    Thanks so much for taking the time… I truly appreciate it. I searched through all the code and couldn’t find those selectors… I’m sure I’ve overlooked something as my eyes start too glaze over after awhile : ) Am I the only one this happens to??

    I did try to implement what you’ve suggested and it didn’t quite work.

    However, Sion’s solution did seem to work!!! Thanks so much for chiming in Sion.

    Thanks again for all the support!

    I have this very same question.I tried adding the text to the footer of a widget but it just doesn’t work. I have a child theme as well, and that child theme has a custom css file but adding code there seems not to override the css of the parent theme, or I’m doing something wrong. Please help!

    Xondra, could you open your own thread please? Please give a link to your site when you do.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Customizr theme, text-align widgets in footer’ is closed to new replies.