0

I could do with a bit of help on this one. This page; http://fredericacards.co.uk/greetings-cards.php has a bunch of divs for products with an h3 heading. That h3 has a 20px top margin in Safari and a 20px top and bottom margin in Firefox that doesn't appear to originate from anywhere I can find.

It's an old-ish site so I haven't used a boilerplate reset but I've done the usual margin and padding 0 for *

I have debugged to the extent of reducing the page to just one offending div with Firebug but nothing I do, other than setting the top-margin to -20px, will shift that heading up.

What am I missing here?

I don't normally have a problem with spacing content so I guess there's something I'm carrying around that maybe a 2nd pair of eyes can spot.

Chris Pink
  • 1,558
  • 1
  • 15
  • 28
  • 2
    _“What am I missing here?”_ – what a proper question here on SO is supposed to look like. Please go read [ask]. – CBroe May 20 '15 at 12:03
  • I don't wish to be rude but how exactly would you like me to ask what I am missing? See the answer below for that which I missed – Chris Pink May 20 '15 at 12:34
  • @ChrisPink You can read [this guide](http://stackoverflow.com/help/how-to-ask) that CBroe suggested to know how to ask great questions. The most important point that you can improve on is creating a [minimal, complete, and verifiable example](https://stackoverflow.com/help/mcve) within the question itself. – Anonymous May 20 '15 at 12:56
  • Surely a 'great question' is one that gets a quick and pertinent answer. In that respect that's exactly what happened and my question is resolved. I have read the guide but thank for linking to it again. Anyway, I am out of here, thanks to Kurt Serge I can now get on with the real business of the day. – Chris Pink May 20 '15 at 13:03
  • No, a great question is one that will help future readers that stumble upon it – and without any code in the question, but an external link only that is usually not given, because the external link then gets changed to fix the problem, so no one can see the original state of the code any more. (OK, since this was kind of a special case, usefulness for future readers will likely be quite low – but that was not foreseeable at the time you asked the question.) – CBroe May 20 '15 at 13:28
  • No, I'm sorry, you are just arguing for the sake of it. There is no way to frame this question in any other way. I spend all day every day (slight exaggeration) putting type into divs, would normally spend around 30 secs getting it in the right place. In this case something was going wrong so I asked what i had missed. Within 30 mins someone showed me. That Mr Broe is a great question. – Chris Pink May 21 '15 at 14:24

1 Answers1

3

You have some kind of funky characters in your product div - what code editor are you using? Look at the source HMTL:

enter image description here

Kurt Serge
  • 311
  • 1
  • 10
  • Right click page -> "View Page source" – Kurt Serge May 20 '15 at 12:19
  • my source does not seem like image you provided – Bilal Maqsood May 20 '15 at 12:20
  • @BilalMaqsood if you're using google chrome inspect element you don't directly see it. Then you first need to right click and click 'edit as html'. then you see red dots instead of these weird squares... – JoJo May 20 '15 at 12:21
  • These are introduced by Filemaker, I can see how they are getting in but I'm not seeing them in my code editors; Coda and Dreamweaver. I will reprocess the files without them, although a quick test seems to indicate it's not the problem, it's an unnecessary confusion. – Chris Pink May 20 '15 at 12:25
  • Spot on. That was exactly what I was missing. Now I need to know how to do new line in a Filemaker variable but that's a conversation for another day @Kurt Serge: Well spotted sir! – Chris Pink May 20 '15 at 12:33
  • I do need to find a code editor that will reveal what I assume is a low ASCII character – Chris Pink May 20 '15 at 12:37
  • I use Notepad++: http://stackoverflow.com/questions/767545/does-notepad-show-all-hidden-characters – Kurt Serge May 20 '15 at 12:45
  • Seems like Coda 2 does have a command "View Invisible characters" though not a way to search and replace on them. – Chris Pink May 20 '15 at 12:47