TechSpot

Web Page Framing

By bigwat
Jan 8, 2011
Post New Reply
  1. OK ive tried to put a frame on a web page that ive been designing but i want it a little different than usual, i want the entire page in the middle while only a solid background behind that. Just like the pic below.
     

    Attached Files:

  2. jobeard

    jobeard TS Ambassador Posts: 13,450   +324

  3. bigwat

    bigwat TS Enthusiast Topic Starter Posts: 105

    thanks

    thank you i'll have a look and comment.
     
  4. bigwat

    bigwat TS Enthusiast Topic Starter Posts: 105

    rather complicated

    Ive tried to use the css styling but its complicated for the level at which i am. But then there is another problem, ive used pictures in my htnl codings but i have to copy the entire file name eg file:///E:/Users/Public/folder/Sample%20Pictures/image.jpg
    and this prose a problem cuase if i bring the thumb drive with me if the drive is F:// the image file wont run can you please help me anyone?
    thanks.
     
  5. jobeard

    jobeard TS Ambassador Posts: 13,450   +324

    last issue first, the picture.

    To make an html file portable you need to use a relative url, not an absolute.

    as an example, take any webpage in your browser (the google.com homepage is good because it is simple)
    and do a file->save as--> google.html
    and be sure to use the Webpage Complete format.

    if the page is saved in My Documents\google.html
    there will be a new folder My Documents\goolge_files\
    where all the graphics are stored

    edit goolg.html and you will see relatice urls for files in google_files\

    a relative url does not begin with http : // but (in the case above) "google_files/..."

    SO; create your page
    create a directory
    place your graphics in the directory
    reference them best with url = "./directoryName/..."

    when you export to the USB, place the HTML in the partent directory of the directoryName
     
  6. bigwat

    bigwat TS Enthusiast Topic Starter Posts: 105

    i still dont get it, what exactly are you trying to say where/ how t save the picture files(the images are not from the web).
     
  7. jobeard

    jobeard TS Ambassador Posts: 13,450   +324

    trying to teach by example

    take a known thing
    examine it, see how it works
    use it as a model

    try again ...
     
  8. bigwat

    bigwat TS Enthusiast Topic Starter Posts: 105

    ok ive really tried to figure out the posted answer but i cant so is there any other way?
    Thanks in advance.
     
  9. jobeard

    jobeard TS Ambassador Posts: 13,450   +324

    which issue?
    • making a page portable to different systems
    • framing content

    on (B),
    the old way was to use a table of 3 rows by 3 columns
    onlu row 2, cell 2 contains data

    fixed cell width on column 1,3 force white space horizontally

    fix row height on rows 1,3 force empty header and footers​
    considered bad style today
     
  10. bigwat

    bigwat TS Enthusiast Topic Starter Posts: 105

    Thanks for the advice and oh i meant on the portable .... i mean if i make a folder and put all the files in it i still have to put the entire file name and extension and thats a problem i mean is there any other way in the world? please if there is any help illapreciate, i need this.
    Thanks.
     
  11. jobeard

    jobeard TS Ambassador Posts: 13,450   +324

    save the attachment in \FOO and study where files are stored and how the HTML refers to them
    you can then copy \FOO\*.* to external media and load the page without a webserver :)
     

    Attached Files:

     
  12. jobeard

    jobeard TS Ambassador Posts: 13,450   +324

    exhamine ListGarden_doc.html

    look for
    Code:
    href="ListGarden_doc_files/..."
    You ship the top HTML (ListGarden_doc.html) and a Directory (ListGarden_doc_files) full of scripts and images.

    HREF="ListGarden_doc_files/..." is a relative url, relative to where the current HTML file came from.

    Moving such HTML & Dirs/* to any other location (including USB and real webservers) will still work without modifications :)
     
  13. bigwat

    bigwat TS Enthusiast Topic Starter Posts: 105

    ok thanks alot what i did was send all the files i was using to the same folder and the use the file name only ,worked so thanks for the help.
     


Add New Comment

TechSpot Members
Login or sign up for free,
it takes about 30 seconds.
You may also...


Get complete access to the TechSpot community. Join thousands of technology enthusiasts that contribute and share knowledge in our forum. Get a private inbox, upload your own photo gallery and more.