[Resolved] Styling GP hooks

Home Forums Support Styling GP hooks

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #99095
    Davinder Sangha

    Hi.

    Trying to style the bottom of the blog so that the box/table is max 1060 wide. However, anything I try isn’t reflected in the bottom.

    http://www.workwearexpress.com/blog/

    I’ve tried adding classes to the table, etc. in Dreamweaver, but it only applies them to the images in the footer.

    #99155
    Tom
    Lead Developer
    Lead Developer

    You shouldn’t really be using tables to display information like this – you should be using divs.

    For example:

    <div class="grid-container grid-parent">
          <div class="grid-30">
              social icons in here
          </div>
          <div class="grid-70" style="text-align:right;">
              other info in here
          </div>
    </div>

    If you must use tables, try removing the width=”” attribute, and set the style width attribute to “max-width” instead.

    Let me know if this helps or not 🙂

    #99386
    Davinder Sangha

    Works’s great. Thanks!

    I modified it a little bit so the HTML is:

    <div class="grid-container grid-parent"> 
    	<div class="grid-1"><a href="https://www.twitter.com/workwear_ex"><img src="https://www.workwearexpress.com/images/social/1.png" alt="Twitter" width="40" height="40"></a> <a href="https://www.facebook.com/pages/The-Workwear-Express-Group/133728690017823"><img src="https://www.workwearexpress.com/images/social/3.png" alt="Facebook" width="40" height="40"></a> <a href="https://plus.google.com/b/100249405216224979417/+Workwearexpressltd/posts"><img src="https://www.workwearexpress.com/images/social/2.png" alt="Google+" width="40" height="40"></a> <a href="https://www.youtube.com/channel/UClvfQROSDFjbdXs75u6-QCg"><img src="https://www.workwearexpress.com/images/social/4.png" alt="YouTube" width="40"></a></div> 
    	<div class="grid-2"><img src="https://www.workwearexpress.com/images/payment-logos.png" alt="Payment Methods" class="Security"></span></div>
    	<div class="grid-3">Head Office and Factory: Workwear Express Ltd, Cathedral Park, Belmont Industrial Estate, Durham, DH1 1TF<br>
    Tel: 0800 028 5867 | Fax: 0191 384 7468 | Email: <a href="mailto:sales@workwearexpress.com">sales@workwearexpress.com</a><br>
    Registered in England. Company No. 3743499</span></div>
    <div class="grid-4"><img src="https://www.workwearexpress.com/images/25years.png" alt="Celebrating 25 Years" width="70" height="70"></div></div>

    and the CSS is:

    .grid-1 {
        float: left;}
    
    .grid-2 {
        float: right;}
    
    .grid-3 {
        display: block;
        float: left;
        font-family: arial;
        font-size: 12px;
        line-height: 18px;
        position: relative;
        text-align: right;
        width: 92%;}
    
    .grid-4 {
        float: right;}
    
    #99505
    Tom
    Lead Developer
    Lead Developer
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.