SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Mar 2012
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    what was the steps we have to take before starting the webpage

    what are the steps we have to take to appear webpage similarly in all the browsers? means in css and html

  2. #2
    Mouse catcher silver trophy Stevie D's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    5,881
    Mentioned
    122 Post(s)
    Tagged
    1 Thread(s)
    If you aren't too worried about IE7 and older, you can usually get a pretty good similarity in all mainstream browsers just by making sure that you have used valid code - use the validators (http://validator.w3.org for HTML and http://jigsaw.w3.org/css-validator for CSS) and fix any errors that are highlighted. That isn't guaranteed to give you an identical cross-browser rendering, but it sorts out most problems.

  3. #3
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,107
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    Yes, just make sure you understand CSS and HTML properly, and don't try to do anything too fancy. Simple, straightforward HTML works in all browsers, so add your CSS carefully. It's best to check each browser as you go.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  4. #4
    Foozle Reducer ServerStorm's Avatar
    Join Date
    Feb 2005
    Location
    Burlington, Canada
    Posts
    2,699
    Mentioned
    89 Post(s)
    Tagged
    6 Thread(s)
    Hi

    Iteratively test as you markup and add CSS rules; if something you do is breaking on one of the browsers than rethink/research how to not have it break without using conditions, javascript or some other way of serving to a specific older or version of browser.

    Be careful in using floats as Older IE has some wicked bugs that will cause different rendering without CSS hacks or Conditional Comments. It doesn't mean you can't use them, you should just be knowledgeable about the best techniques so you don't have to mangle your code.

    Don't be afraid to let a different user experience to happen on browsers than won't or are difficult/complicated to make work with some features like using CSS3 shadows on boxes or text and plain borders and text if the CSS3 is supported. But do make sure that even your basic look will work; for example don't use white text with a shadow that doesn't render on a white page.

    You can use JavaScript shims for IE8 and IE9 but make sure if JS is turned off that the site doesn't fall apart. Look for all your enhancements to gracefully degrade to a simpler yet functional version.

    Hope this helps a little.
    Steve
    ictus==""

  5. #5
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    For beginners, I definitely recommend coding in small sections. Code the HTML/CSS for one section of the website (not too much!) and then check it in all the browsers. That way, if something breaks, you can definitely narrow down what is causing it. It's frustrating to code the whole page, check it in the browsers, and find that one (or all) are way out of whack.

    As you get better, you can check it less frequently. Many people, myself included, just check at the end of the document, validate then, etc. Until you get the hang of coding and feel fluent in it, definitely check it every once in a while.

    Especially in IE. Those versions of browsers create some wicked results sometimes, especially when floats are involved (as ServerStorm mentioned)
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work


Bookmarks

Posting Permissions

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