Posted on 01/01/2016 6:27:47 AM PST by ShadowAce
Great post. Thanks. HTML education (I could use some) BUMP!
2015 has some very informative posts. http://www.freerepublic.com/focus/f-chat/3242857/posts?page=150#150
Thanks, Shadow Ace—this is very helpful.
I learned a few new things here.
I think I’ll try some of these things in 2016.
Happy New Year to you!
Terrific post. It would be great to have this in printable form.
Has the quote and apostrophe problem been fixed yet!
Copy>Paste to a new MS Word doc, reformat, save and you’re all set.
With the proliferation of display devices, screens now come in a wide variety of sizes and aspect ratios. The image below illustrates the range of screens possible. Differing aspect ratios are shown on the diagonal lines with the ratio in circles towards the lower right.
Given the wide variation in screen resolution and size when we step from mobi to fondleslab to display to HDTV it is lunacy to specify screen position in term of pixels. There is no way to know what sized screen you are imaging to so it is best to reference screen sizes and positions in percentages instead. The resulting size is the percentage of the width (or height) of the enclosing container. This is most useful when specifying positions and sizes of tables and images. The HTML for the image above looks like:
<img src="http://upload.wikimedia.org/wikipedia/commons/4/44/Vector_Video_Standards5.svg" width="95%">
The
width="95%"
part sets the image width to 95% of the width of the enclosing container. We leave the height unspecified so that the computer will figure out the correct value so as not to distort the image. If you wish to distort the image you may specify a height as well.Things that are text related, such as the whitespace around a paragraph or header and text sizes are best specified in
em
. Oneem
was originally the width of an M in the current font. In a multi-lingual world where not all alphabets have an M in them, the meaning has evolved to mean the height of the current font. As the user changes the magnification on a page the size of anem
changes with it. This produces a pleasing scaled effect to the eye not possible when spacing objects in pixels.Other unit values available are
in
inch,cm
centimeter,mm
millimeter,ex
x-height of a font (x-height is usually about half the font-size),pt
point - 1/72 of an inch,pc
pica - 12 points andpx
pixels - a single dot on the screen. If no units are specified pixels are used by default. Best results across the broad spectrum of displays are achieved by exclusively using em and percent to specify size and distance. Try not to do anything else.
Any element (anything between tags) can be explicitly positioned by either putting it in a table or centering it <center></center>. Beyond that, explicit positioning is purposefully made as difficult as possible so that you won't do it. Your page will be displayed on a variety of devices of differing sizes and the less you constrain where the elements are positioned the better the general result will be across the broad spectrum of displays.
Inside tables you can use the attribute
<td align="right"> ("left|right|center|justify|char")
are acceptable values. The "char" option is mishandled by all the major browsers so it doesn't see much use. Align can also be used with images and horizontal rule,<img src="http://mumble.com/image.jpg" align="right">
will work. So will<hr align="right">
This is all in the HTML 4.01 idiom that we are trying to make go away.To summarize, using HTML you can Center an element or put it in a table to control its position. This is why tables are wildly overused.
Freedom ≠ Free Stuff☭ I, for one, welcome our new Cybernetic Overlords /. Mash Dobbshead® for HTML, bop Hello_Cthlhu for XAMPP
bkmk
No, the problem is called smart quotes. A solution until it is fixed is to run your text through this tool before posting.
http://dan.hersam.com/tools/smart-quotes.html
I does a great job of getting rid of those unprintable characters.
Thank you for this!
Refreshers are always helpful. Thanks.
Also, posting a reply with quotes displays properly, but if you copy and paste someone else's post to use in a reply, the quotes get screwed up again.
Extremely frustrating no matter how many web sites there are to strip smart quotes. Free Republic is GENERATING smart quotes!
Thanks!
Bookmark.
Thank you ... any way to make sure an image isn’t a couple of feet wide so it doesn’t mess up the entire thread with tiny, unreadable font?
bfl
Shouldn't that be http://www. ?
HTML Help Threads & Other Info for Newbies
(And Anyone Else Who Needs It )
Just Click The Links Below For The Threads
- HTML Sandbox (Original Thread)
- HTML Sandbox (Thread Two)
- HTML Sandbox (Thread Three)
- HTML Sandbox (Thread Four)
- HTML Sandbox (Thread Five)
These are the current active threads.
Most of the older HTML Bootcamp and
HTML Campfire Threads are no longer active links.
Those have been removed over time.
Also This for New Freepers
Even More Info For New Freepers
Disclaimer: Opinions posted on Free Republic are those of the individual posters and do not necessarily represent the opinion of Free Republic or its management. All materials posted herein are protected by copyright law and the exemption for fair use of copyrighted works.