7 {{ upvoteCount | shortNum }}
7 {{ upvoteCount | shortNum }}

Viewing HTML page and CSS in browser?

by zsawevv212
6 replies
  • WEB DESIGN
    • |
I have finally sorted out how to link the CSS but say I am working on my homepage, how do i view it in the browser, with the CSS affecting it. Does that make sense?

I am using a text editor, so at the moment to check my page I am just opening the file in firefox, but the things I have changed on the external style sheet doesnt show up. How can I view it in the browser, with the things that I have changed in the CSS showing up?

The only way I can see to do it is to upload it to the web every time I want to check something...which there must be an easier way than!!
#browser #css #html #page #viewing
  • Profile picture of the author aesoft
    Originally Posted by zsawevv212 View Post

    I have finally sorted out how to link the CSS but say I am working on my homepage, how do i view it in the browser, with the CSS affecting it. Does that make sense?
    Hello,
    I am using a text editor, so at the moment to check my page I am just opening the file in firefox, but the things I have changed on the external style sheet doesnt show up. How can I view it in the browser, with the things that I have changed in the CSS showing up?

    The only way I can see to do it is to upload it to the web every time I want to check something...which there must be an easier way than!!
    IE 8 has some developer tools that could assist with this, as well as the FireBug plugin for FireFox and with Google Chrome you can right mouse click over an element on the page and you should see 'Inspect element' at the very bottom of the context menu (which is the menu that pops up when you right mouse click). Click on 'Inspect element' to open the developer tools window to see the resources.

    Note: There are various elements where you will not see 'Inspect element' in the context menu, if this is the case then right mouse click over another part of the page until you see it.

    You can pull up the developer tools in Google Chrome by pressing Ctrl + Shift + I at the same time and open up IE 8's AND FireFox's FireBug developer tools window by pressing the F12 key.

    Note: The FireBug add-on would need to be installed before the F12 key works with it.

    FireFox has a bunch of other add-ons that could assist too:
    FireFox Web Development Add-ons

    Find which one works best for you and you should get the hang of the tools in no time.

    Good luck!
    {{ DiscussionBoard.errors[3066147].message }}
  • Profile picture of the author indexphp
    Like aesoft said, use Firebug for FIrefox

    Watch this video: #15: Introduction to Firebug
    Signature
    www.TrafficPlusConversion.com
    {{ DiscussionBoard.errors[3066218].message }}
  • Profile picture of the author Lloyd Buchinski
    FF can be a complete pain in the neck letting go of its css cache. It won't make any difference if it is a desktop file or on a server. Using ctrl + f5 will usually force it to reload the css file, but I have had times when it wouldn't.

    Sometimes the only I can make that happen is with the web developer toolbar. I'm on a borrowed machine with only IE now so I can't double check and make sure all the detaills are right, but to the best of my floppy memory, this was the way I did that.

    In the web developer toolbar, click on css and then edit css. You will have your css style sheet displayed. Then I take the lines from the changed css sheet and paste them over the lines that FF is hanging on to. Then I click save changes. From then on it will display the page with the new css on it. That is a long ways to go for something simple, but this has been a screwy problem with FF for years.
    Signature

    Do something spectacular; be fulfilled. Then you can be your own hero. Prem Rawat

    The KimW WSO

    {{ DiscussionBoard.errors[3068685].message }}
    • Profile picture of the author ronc0011
      Do yourself a favor and go to Microsoft's website ad download Visual Studio Express edition. It's free and it's the best web development software you can get at any price.

      It has its own web server built in so you can preview your pages as you work on them.
      {{ DiscussionBoard.errors[3069244].message }}
      • Profile picture of the author janita
        Internet Explorer 8 has some new developer features. You can see there.
        {{ DiscussionBoard.errors[3070431].message }}
  • Profile picture of the author ashish786
    Hi, Friend Use Firebug Plugin.
    {{ DiscussionBoard.errors[3073676].message }}

Trending Topics