Results 1 to 9 of 9

Thread: Dreamweaver/Fireworks issue in Firefox

  1. #1
    Registered
    Join Date
    Oct 2011
    Location
    London
    Posts
    12
    Rep Power
    0

    Dreamweaver/Fireworks issue in Firefox

    Hi Guys,

    Everyone was so helpful with last post that I thought I'd ask for some help again!! This is kind of a two fold problem- the first part is probably very basic web design knowledge, but here goes.

    a) I'm designing on a Mac in Dreamweaver, and previewing on Firefox and Safari. Having pretty much finished my site now I've been checking it on my wife's PC laptop (Firefox and Chrome) and find that the whole site seems to bee a little bit "zoomed" and stretched horizontally (the "grid" boxes should be square). Is there any way of forcing it to "fit to screen" as it did on the browsers on my Mac. for reference, the website is up at http://www.magneticchamber.com (it's not hosted here)

    b) It seems that the opening image swapping map doesn't seem to work in Firefox (either mac or pc, but does in Safari and Chrome) anymore, now that it's actually up online. It previewed fine from file on my mac, but now it seems to not align properly (it should be symmetrical in grid format, and square, not kinda broken up with big spaces)

    Any help greatly appreciated!!!

  2. #2
    Custom User Title tpoynton's Avatar
    Join Date
    Sep 2004
    Location
    Mass
    Posts
    2,177
    Rep Power
    18
    RE: a, it probably has more to do with the screen resolution than anything else. It also seems a little bit wide, so you might get the horizontal scroll bars on smaller/lower res screens.

    RE: b, the problem may be that spacer.gif does not seem to exist. The code for the table is also making me nauseous, with all the different rowspans/colspans. Seems to me you could set the column widths using a header row, then simply populate the correct cell with the image you want to avoid all the merged cells, which probably are not helping either...this would mean breaking up some of your images though, upon further investigation...I think you can more easily address the alignment issues if you have each table cell contain one square image, but this may complicate the rollover code to get the visual effect you want.

    SO, try finding spacer.gif first

  3. #3
    Registered
    Join Date
    Oct 2011
    Location
    London
    Posts
    12
    Rep Power
    0
    Thanks for your reply!! So for issue a) there's no script or anything that I can put on the page to get it to "fit" on lower res screens? I was thinking a bit like those diversion scripts to send iphone/ipad users to your alternate site based on their screen size. I'm just trying to avoid having to go in and resize everything, as I really like the way it looks on the mac screen.

    b) I just did this main imageswap graphic in Fireworks, so the coding is all from there. Upon a bit more research, it seems that everyone says Fireworks code is really crap!! If I can't find the spacer.gif, or if that doesn't fix the problem, would it be better to just try and export "images only" from Fireworks, then build the table myself in Dreamweaver?

    I'm not trained in any of this stuff, just bumbling through best I can, so I'm hoping that wouldn't be beyond me.

    As a final note, I realised that indeed it doesn't load right in Firefox from file now either, but it DID a few days ago before I updated Firefox (on both Mac and PC)-- could this just be a Firefox bug?

  4. #4
    Custom User Title tpoynton's Avatar
    Join Date
    Sep 2004
    Location
    Mass
    Posts
    2,177
    Rep Power
    18
    RE: the width, if you make the header the same width as the table, that should help. I have not done the lower res stuff for phones and what not, but my understanding is that it basically brings people to a different website - CSS changes, mostly, as I understand...

    I too like the effect you have achieved, it's unique - but it is also using a table with merged cells and what not, which I personally try to avoid.

    I recall your last post, where this problem did not occur; I'd be looking to find out what is different! Hopefully you have kept copies of the old files somewhere?

  5. #5
    Registered
    Join Date
    Oct 2011
    Location
    London
    Posts
    12
    Rep Power
    0
    Right- finding teh spacer.gif solved the problem immediately. You're a STAR!! I'll try and learn Dreamweaver a bit better so that I can code this sort of thing myself in future without having to rely on Fireworks-- it seems most people are dubious of the coding Fireworks produces. I'm new at all this, so taking one step at a time for now.

    Will research to see if my idea of "squeezing" the page so that it fits into every screen size is doable. It's just lazy on my part really I suppose-- I should go back, learn form my mistake and re-design with better understanding of resolutions and screen sizes, but I need to get this thing working asap, so will have to do it next time.

    Really, thanks for all your help. Very appreciative!

  6. #6
    Custom User Title tpoynton's Avatar
    Join Date
    Sep 2004
    Location
    Mass
    Posts
    2,177
    Rep Power
    18
    awesome!

    FWIW, I checked your page using the W3 validator, and it validated for the most part - just a couple of alt tags missing. SO, while the fireworks code makes me gag, it shouldnt make a browser do so.

  7. #7
    Registered
    Join Date
    Oct 2011
    Location
    London
    Posts
    12
    Rep Power
    0
    =) Brilliant. I'm on such a steep learning curve here that I have to admit to not really knowing about validation etc, so I'll look all that up and educate myself. I do want to learn this stuff properly, it's just finding the time to do it around my current job.

    Had a thought about the "resizing" issue though. I've been reading an article on "responsive web design", and it seems to me that what I want to do should be in some way possible. It's really just the same sort of thing that happens when a page gets viewed in you smartphone or tablet browser, right? Everything automatically "resizes" to fit- even though you can override some of those functions. There must be a way of saying "fit webpage to screen depending on what the display resolution is". Does it sound feasible?

    Here's the article I was reading-- http://coding.smashingmagazine.com/2...ve-web-design/

    I've used a redirect script on another site so that smartphones and tablets get a different version of the site, but I'm trying to find a way of just resizing this one automatically...pipe dream?

  8. #8
    Custom User Title tpoynton's Avatar
    Join Date
    Sep 2004
    Location
    Mass
    Posts
    2,177
    Rep Power
    18
    I'm not an expert, or even a novice, on making pages work on lower res screens. That article is interesting, and I'll review it more in depth if I ever decide to embark on this. The biggest stumbling block, seems to me, are the image sizes - you can easily have content shrink to fit by using CSS to set all widths by % instead of pixels. The article also talks about a CSS property to set image widths - but it is not supported (at the time of that writing) by IE - which means you need to identify the browser somewhere and use a different CSS for IE only. I personally never do this, but I have found that having both a proper doctype declaration and html/css that validate will force IE into 'standards compliance mode', which then solves many cross-browser issues.

    There is a bit of learning; were I you, I'd start by trying to create the effects and such without relying on fireworks/dreamweaver, but instead by using a straight text editor (notepad++ on windows and komodo on the mac are my favorites). I have also strived to avoid using javascript to get myself more familiar with CSS. While I am not certain, I am fairly sure you can achieve what you have with only CSS...and the process of trying to figure that out will teach you a lot. good luck!

  9. #9
    Registered
    Join Date
    Oct 2011
    Location
    London
    Posts
    12
    Rep Power
    0
    Fantastic- thanks for all your advice. I'll start looking at creating stuff using a text editor and see how it goes. There'll be some great books and probably online tutorials on that sort of stuff. Would like to get to the level where I might be able to help others on here like you've helped me. Thanks for your time!!

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •