locked
simple HTML web site - Safari compatibility RRS feed

  • Question

  • I have a simple web site with pages having modules inside ONLY: some modules contain text, other ones contains single photos. I use Frontpage extensions on my provider' server.

    I got trouble with spacing between modules: correct in IE, sometimes bad in Safari; so, I got superimposed modules in Safari or too much spaced in IE.

    I used Frontpage 2003 to make my pages, now I've buyed expression web 3 and I'm just starting to use it.

    Any suggestion?  Thanks in advance!

     

    Stefano

    Thursday, June 17, 2010 1:02 AM

Answers

  • Dont' use position, top, left, Z-index to arrange your content. (Don't drag things around in Design View - that can create this.)

    Apply margin, padding, widths, floats and clears.  Leave height undefined unless the only thing in the div is an image.  Instead, let the div do what it automatically does: resize to accomodate what's in it.  It will expand when text is resized.

    Thursday, June 17, 2010 3:14 PM
  • Adding to Kathy.  You really need to step back and learn HTML / CSS (read up at w3schools.com) and get a base of understanding.  You need to understand the code/properties/tags that you are using and how they are used.

    Once you've read up on HTML and CSS check out Cheryl's video (listed in the Before Posting sticky). 

    The combination of these two things will get you on the right path.


    --
    Chris Hanscom - Microsoft MVP
    On Facebook | On Twitter | Resource Center | Veign's Blog | Web Development Help

    Get a Complete Website Analysis by Veign
    Thursday, June 17, 2010 3:20 PM

All replies

  • .....pardon, "levels", not "modules", I'm not skilled in web site design.

     

    Stefano

    Thursday, June 17, 2010 1:05 AM
  • We have no idea what you have done.  A verbal description tells us nothing: we need to see your actual work.  Post a link to your site, please. (We can make guesses, but that's a waste of time for us and for you.)
    Thursday, June 17, 2010 1:28 AM
  • Nobody can help with a display issue without seeing the page. Upload it somewhere even if just to a temporary test site and post the url.

    If you are new to web design I'd suggest you spend some time with the resources in the BEFORE POSTING sticky at the top of this forum. Pay particular attention to the Basic Website tutorial and the W3Schools materials.


    MS MVP Expression Tutorials & Help http://by-expression.com
    Thursday, June 17, 2010 2:02 AM
  • In general, I would suggest taking a course in CSS and learning the differences between the two. If you want an easier way to get UI up and running across multiple browsers, you can use a library like JQuery UI to help you render a decent looking UI. This does not excuse you from learning some CSS, but it can certainly make things easier. Unfortunately, Expression web won't "hold your hand" on this one.

    --
    Peace and Grace,
    Gregory A. Beamer
    MVP: Visual C# Architecture
     
    *************************************************
    |  &n bsp;         Think Outside the Box!           &nb sp;    |
    *************************************************

    Think outside the box
    Thursday, June 17, 2010 2:02 AM
  • OK, maybe I'm being thick today, but I have no idea what the hel a "module" or a "level" is supposed to refer to when speaking WRT a "simple HTML Web site." Somebody want to clue me in?

    cheers,
    scott

    C'mon, folks. This isn't rocket science, nor neurosurgery. It's "Expression" (singular) "Web" (singular), in that order, followed by a version numeral if you wish to be specific. It is often abbreviated "EW." It is not "Web Expression," "Expressions Web," "Web Expressions," or plain "Expression" or "Expressions." Not using the correct name indicates either ignorance or laziness. Most folks would rather avoid the appearance of either.
    Thursday, June 17, 2010 3:31 AM
  • "Somebody want to clue me in?"

    Not until we can see it. ;-) Maybe then we'll know what the terms mean, and only then will we be able to tell what his problem is.

    Can't fix how a site looks without actually looking at the site.

    OTOH, I have a feeling that English is not his first language, so it may be a translation problem. His English is far better than I can do in any other language, even though I had 6 years of German. It is true, if you don't use it you lose it.


    I dream of a better world...a world in which a chicken can cross the road without its motives being questioned.
    Thursday, June 17, 2010 4:08 AM
  • OTOH, I have a feeling that English is not his first language, so it may be a translation problem. His English is far better than I can do in any other language, even though I had 6 years of German. It is true, if you don't use it you lose it.


    I dream of a better world...a world in which a chicken can cross the road without its motives being questioned.


    You're probably right, on both counts, now that I re-read the posts. On your second point I'll agree heartily. Over the course of time I have taken Latin and Spanish (high school) and French and German (college), and couldn't actually make conversation today in any of them. Really helped my English language skills though!  ;-)

    Paraphrase of a quote I read somewhere and can't recall exactly at the moment: "The English language doesn't borrow from other languages. It follows them down a dark alley, hits them over the head, then goes through their pockets for spare expressions."

    N'est-ce pas?

    cheers,
    scott


    C'mon, folks. This isn't rocket science, nor neurosurgery. It's "Expression" (singular) "Web" (singular), in that order, followed by a version numeral if you wish to be specific. It is often abbreviated "EW." It is not "Web Expression," "Expressions Web," "Web Expressions," or plain "Expression" or "Expressions." Not using the correct name indicates either ignorance or laziness. Most folks would rather avoid the appearance of either.
    Thursday, June 17, 2010 4:32 AM
  • My guess is "layers". A FP site that usually displays right in IE, but wrong in everything else? "Superimposed" elements? Sounds like absolute positioning once again! Time for some studying and probably a site rebuild, sorry to say.

    Gregory, in what universe is using jQuery easier for a newbie than just learning enough CSS to make a simple page? I've been messing around with jQuery UI for an app I'm working on, and it is really slick, but I'm sure glad I learned how to make a basic site first. Coming from FP, I doubt the OP has a background in javascript.

    Jim

    Thursday, June 17, 2010 4:35 AM
  • Gregory,

    IMO, The last thing you should tell a newbie who doesn't yet understand CSS and HTML is to jump into JQuery.  A simple site with pictures and text in it, which is what the OP described, has nothing to do with javascript, and you certainly can't think that JQuery is easier than basic CSS and HTML.

    Thursday, June 17, 2010 7:02 AM
  • Here's one of the pages:  http://www.studiorossi.biz/STUDIO%20ROSSI%20main%20page.htm

    The second photo (the one with Weller hardware) goes superimposed on the above text (only in Safari); menu in the bottom of page does the same.

    Maybe the way of designing I used it's not the right one..............any suggestions?

     

    Thanks again!

     

    Ste

    Thursday, June 17, 2010 9:55 AM
  • Yes, I think tha actual problem is using absolute positioning; I'm currently searching a way to fix the situation.......
    Thursday, June 17, 2010 11:15 AM
  • what about using z index property? I'm just trying this............
    Thursday, June 17, 2010 11:18 AM
  • no, sorry, I'm wrong about z index, this is used when overlaying is just desired............
    Thursday, June 17, 2010 11:25 AM
  • Dont' use position, top, left, Z-index to arrange your content. (Don't drag things around in Design View - that can create this.)

    Apply margin, padding, widths, floats and clears.  Leave height undefined unless the only thing in the div is an image.  Instead, let the div do what it automatically does: resize to accomodate what's in it.  It will expand when text is resized.

    Thursday, June 17, 2010 3:14 PM
  • Have you looked at the jQuery UI?  Its not for making a website, its for adding effects / components to an existing website / design.  Add to that that the jQuery UI is for adding Javascript effects.  Sorry but this a 100% wrong direction for the OP.


    --
    Chris Hanscom - Microsoft MVP
    On Facebook | On Twitter | Resource Center | Veign's Blog | Web Development Help

    Get a Complete Website Analysis by Veign
    Thursday, June 17, 2010 3:18 PM
  • Adding to Kathy.  You really need to step back and learn HTML / CSS (read up at w3schools.com) and get a base of understanding.  You need to understand the code/properties/tags that you are using and how they are used.

    Once you've read up on HTML and CSS check out Cheryl's video (listed in the Before Posting sticky). 

    The combination of these two things will get you on the right path.


    --
    Chris Hanscom - Microsoft MVP
    On Facebook | On Twitter | Resource Center | Veign's Blog | Web Development Help

    Get a Complete Website Analysis by Veign
    Thursday, June 17, 2010 3:20 PM
  • thank you Kathy and Chris.  First, I'll follow Kathy's indication and besides I actually begin to study this matter, though it's not in my job area.
    Friday, June 18, 2010 1:16 AM
  • With respect to jQuery (and this is not meant as an indictment of anyone or any post, period, so please do not take it that way), the first thing that impressed me about the framework was the power of its accessors. To my mind, they are the heart and the driving engine that enables jQuery to perform its magic.

    The thing is, to effectively use those essential elements of jQuery, one must first have a thorough understanding of the structure of a Web page, particularly if one is to effectively employ another of its sterling features, chaining. In addition, the natural parallels between accessors and CSS selectors argues that one must also have a basic understanding of the functioning of CSS in altering the presentation of a page's structure. When I consider how jQuery works, I doubt that I would be able to use it in any effective fashion without first attaining a fundamentally sound understanding of CSS and HTML, and how they work together.

    jQuery is a powerful tool, capable of making truly sophisticated dynamic effects relatively simple to implement, when compared to having to achieve the same ends using javascript alone. Granted, using pre-built plugins can enable the semi-sophisticated user to achieve some pretty neat results, but the minute any degree of customization is required that goes beyond the plugin's capacity, or when something breaks, you still need to be able to look at the markup, look at the CSS, and figure out what's going on and how to obtain the desired ends.

    Just my $0.02 worth...  ;-)

    cheers,
    scott


    C'mon, folks. This isn't rocket science, nor neurosurgery. It's "Expression" (singular) "Web" (singular), in that order, followed by a version numeral if you wish to be specific. It is often abbreviated "EW." It is not "Web Expression," "Expressions Web," "Web Expressions," or plain "Expression" or "Expressions." Not using the correct name indicates either ignorance or laziness. Most folks would rather avoid the appearance of either.
    Friday, June 18, 2010 5:58 AM
  • I've fixed the problem using a one-column table and inserting text and photos into each line.

     

    Thanks again

     

    Ste

     

     

    Sunday, June 20, 2010 2:50 PM