Can anyone suggest a quick CSS fix for this?

Discussion in 'CSS' started by iNET SEO, Jul 16, 2012.

  1. #1
    Hi guys,

    Please have a look at the following page:
    http://www.travelsolutionsireland.com/

    Can anyone suggest a quick CSS fix for the gaps in each of the 4 central boxes - there is a small gap right under each of the 4 headers?

    Thanks,

    Andy
     
    iNET SEO, Jul 16, 2012 IP
  2. workingsmart

    workingsmart Well-Known Member

    Messages:
    411
    Likes Received:
    12
    Best Answers:
    9
    Trophy Points:
    120
    #2
    Not really a css fix... It's a <table> removal that's needed.

    Not really sure why you're using tables for laying that out instead of a unorder list style with your css.

    If you are sticking with the <table> then you will have to align your images to the left for cross browser issues relating to false padding/spacing and you should, at least, add &nbsp; to empty table cells.... Among a few other details with your table.

    You should consider rewriting that area of content eliminating the table for presentation layer....
     
    workingsmart, Jul 16, 2012 IP
  3. iNET SEO

    iNET SEO Active Member

    Messages:
    462
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    60
    #3
    To be honest, I am not good at that level of change and the site isn't one I built. I am just trying to get it fixed somehow :)

    Is it a big fix and do you fancy quoting me on it?
     
    iNET SEO, Jul 17, 2012 IP
  4. ColourKraft

    ColourKraft Member

    Messages:
    32
    Likes Received:
    1
    Best Answers:
    1
    Trophy Points:
    38
    #4
    It's not pretty, and I wouldn't recommend it, but if you don't know CSS very well a quick hack would be to put "position:relative;top:-10px;" (adjust the px value to whatever you want) in the style for the box element, alternatively you can use margins.
     
    ColourKraft, Jul 19, 2012 IP
  5. dareknyght

    dareknyght Banned

    Messages:
    116
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    28
    #5
    This is simply a <td></td> tag in html containing <span>...
    Just remove this and there will be no more space!

    Preview:

    td.jpg
     
    dareknyght, Jul 21, 2012 IP