• Hi All,

    just trying to design my first ever website for my company. As you can see from the footer the widgets all appear on the left alignment. I want them to be evenly spread out to match the menu width.

    How do i go about this? I would also like to add a background to each individual widget box making them all evenly sized.

    Blog is

    http://www.healthathandclinic.co.uk

Viewing 12 replies - 1 through 12 (of 12 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    We need to see your site 😉

    Thread Starter healthathandclinic

    (@healthathandclinic)

    VOILA! thank you andrew for the quick response. damn link tags wouldnt work.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    How are they positioned at the moment, is a plugin adding inline absolute positioning to them?

    Thread Starter healthathandclinic

    (@healthathandclinic)

    hi andrew again,

    I’m just using the standard masonry that comes with twenty thirteen. I have a text widget added to the footer so it just orders them one after the other starting from the left.

    thanks again

    Thread Starter healthathandclinic

    (@healthathandclinic)

    i would also like to have the boxes width widened so the ‘opening hours’ are all on single lines…just to throw in another spanner;)

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Try reducing the width to the <div> that surrounds your widgets,
    E.g.,

    .site-footer .widget-area { max-width: 777px; }

    Then get rid of the extra right margin on the last widget,
    E.g.,

    .site-footer .widget:last-child { margin-right: 0; }

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    i would also like to have the boxes width widened so the ‘opening hours’ are all on single lines

    The ‘opening hours’ title is on one line for me, perhaps you’re seeing an issue in a particular browser?

    Thread Starter healthathandclinic

    (@healthathandclinic)

    sorry andrew,

    i meant that the times themselves arent on one line.

    For example Sun: 8.00am – 11.30am / 5.30pm – 9.00pm appears like:

    Sun: 8.00am – 11.30am /
    5.30pm – 9.00pm

    Thread Starter healthathandclinic

    (@healthathandclinic)

    as for your previous advise, it worked! sort of. if you check the site now they are in the center, however i need them to be the same width as the menu nav bar. is this possible?

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    You’d need to increase the width of the widget for that and since that affects the inline CSS positioning I’m not sure how you’d do that. You’re probably more familiar with this than I.

    BTW structuring your opening hours like this might be easier to style and will be more helpful for people with assistive technologies:

    <dl>
     <dt>Mon / Wed:</dt>
     <dd>8.00am-9.00pm</dd>
    
     <dt>Tues:</dt>
     <dd>8.00am-7.30pm</dd>
    
     <dt>Thurs / Fri</dt>
     <dd>8.00am-10.00am</dd>
     <dd>/6.30pm-9.00pm</dd>
    
     <dt>Sat:</dt>
     <dd>4.00pm - 9.00pm</dd>
    
     <dt>Sun:</dt>
     <dd>8.00am - 11.30am</dd>
     <dd>/ 5.30pm - 9.00pm</dd>
    </dl>

    Thread Starter healthathandclinic

    (@healthathandclinic)

    believe me andrews i dont have a clue lol this is my FIRST ever time at designing a website so thank you!

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    I don’t know the answer sorry.

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘Editting Element Style’ is closed to new replies.