Front page layout jinx

HTML & CSS
1

Hi from too hot & humid Wakefiled UK…

Here’s todays problem:
On this page www.pauserefreshment.co.uk the layout is messed up :frowning:
It looks correct in firefox but a mess in IE 7.


The screen grabs illustrates the layout balls up.

This problem was fixed ages ago but a recent change in ftp client and me not backing up copies of the web site means its uploADED an old index page. The following image best illustrates my current emotional state:

So my question is please, is there a css fix to get the layout as it appears in firefox illustrated as screen grab B?

Any insights welcome…

2

Thanks for all your help, problem fixed.

3

Thanks for replies which i will but too good effect as soon as IT roots out a virus I just got :frowning:

4

Quit using Windows : )

5

Hm. I think IE is confused about the anchor wrapping the image of the coffee cup. IE7 is showing the anchor wrapping the small head image of the first block_1_c box.

IE7 shows (in developer tool)


<p class=address>
  <a>
      <img> <-- this is the coffecup image
        #text <--this part looks wrong
        <img> <--this is the woman head from the first block... notice no opening <div id=block_1_c> there...
          #text
         Then starts with some p class=biglink...

actual HTML:


    <a href="talktous.html"><img src="images/horeca/cup_quote.jpg" alt="Get me a coffee machine quote" width="255" height="187"
 " /></a>

I really don’t see how an extra " would affect the anchor, but I would see what IE7 does once you remove it. The issue seems to be around that line of code.

This problem was fixed ages ago but a recent change in ftp client and me not backing up copies of the web site means its uploADED an old index page.

I’ve just started learning git. You should just go download it now and learn the simplest easiest commands, and get some versioning and automatic storage on your machine. Git’s got plenty of complicated stuff but the basics are simple.

The following image best illustrates my current emotional state:

Man, if it were as simple as “ARG if only I’d made backups!”, my image would be

(except make the white dude a stomme poes). I can’t get all Rambo when self-hating, unless I’m also depressed and want to suicide in a blaze of machine-gun glory.

6

Yes its the extra quotation mark in that image that is breaking the display in IE.

It should be like this:


<p class="address"><a href="hotel_coffee_machines.html">Catering coffee machines</a> | <a href="shop_coffee_machines.html">Shop coffee machines</a> | <a href="office_coffee_machines.html">Office coffee machines</a> | <a href="talktous.html">Get a professional coffee machine quote..</a></p>
[B]        <a href="talktous.html"><img src="images/horeca/cup_quote.jpg" alt="Get me a coffee machine quote" width="255" height="187" /></a>[/B]
        <div id="block_1_c">

Though semantically speaking that anchor should be in a block level element anyway and would have likely fixed the bug.