By using this Web site you consent to the storing of your information.

Follow the Flags

By Phil Graf

Here’s another take on Armchair Travel. We provide you with a growing list of flag images, you employ your computer research skills, and discover how to identify the flag. 

In four easy steps, these colorful flags can transport you away from the here and now to places you know and love as well as places you’ve never heard of.

ONE

Check out this Glossary and keep it handy for your flag “research.” You will find that daily application of these words makes them familiar, and will be a great help in your demystification and identification of flags.

Follow the Flags Glossary

  • Glossary - a necessary and useful reference in identifying flags
  • Field - the background of a flag; the color behind the charges
  • Hoist - the half or edge of a flag nearest to the flagpole - it sometimes refers to the vertical dimension of the flag
  • Fly - the half or edge of a flag farthest away from the flagpole. It sometimes refers to the horizontal length of the flag.
  • Canton - most usually the upper hoist quarter of the flag, such as the field of stars in the American flag - it can refer to any quarter of the flag
  • Badge - a coat of arms or simple heraldic symbol
  • Charge - a figure or symbol appearing in the field of a flag
  • Emblem - a device often used as a charge on a flag, heraldic or modern, e.g. the maple leaf on the Canadian flag

TWO

Armed with your Glossary and the image of the individual flag (below), open your favorite search engine—I use Google—and make your first entry with a single word: “Flag.” This defines the general subject.

THREE

{{Beginning here are my notes and experiments to reconstruct the "bug" about JCE aligning images then disappearing.}}

First, the following is center aligned, but not assigned the popup.

flag of Bhutan 400w

Following is the same image, assigned the popup, but I've centered the image with the editor "Align center" in the top row of icons.

flag of Bhutan 400w

You "should" see a second image just above this text. But it has disappeared after removing the image dimensions. The image dimensions have been removed from both of the above images. The second image, which is linked to the popup, has disappeared.

Here is the actual code in the article editor:
<a href="/images/sampledata/flag-of-bhutan-800w.png" type="image/png" class="jcepopup" data-mediabox="1"><img src="/images/sampledata/flag-of-Bhutan-400w.png" alt="flag of Bhutan 400w" style="display: block; margin-left: auto; margin-right: auto;" /></a>

I aligned the image using the editor "Align center", then used media box to add the popup.

OK! I FIGURED IT OUT! When assigning an image to a popup, the left and right margins are set by the popup CSS and are specific pixel margins - as opposed to not including them in order to retain a responsive image. Removing the dimensions makes the image disappear.

Why it's doing that I don't know. But usually, when something is aligned center using JCE, there is not the specific pixes for left and right margin.

When the image is assigned the popup, even though nothing other than that has changed between the 2 images, combined with the pixel specific margins, the image disappears when the image dimensions are removed.

When I remove the image dimensions (in order to retain the responsive page settings), then the image disappears!

But clearly, you can "inspect" the line where there is nothing, just above the sentence beginning with "You should see...", you will see that the code for the image is there.

Here is a third image using my class tag for alignment:

flag of Bhutan 400w

You may also review the "live" site here - https://sharingourwisdom.net/diversions/follow-the-flags - where I've used the class tag to align the image, and I've removed the dimensions as well as the inline styles for the margins.

{{This ends my notes of reproducing the issue - bug.}}

Scrutinize this flag through the lens of the glossary.

Field - the background is two colors, yellow/orange, equally divided along a diagonal line from the lower point of the Hoist to the upper end of the Fly. The upper/hoist triangle is yellow, the lower/fly triangle is orange. The Charge/Badge/Emblem is a white dragon facing the fly and astride the diagonal line.

Entering that information will allow the program to give you one or more flags that meet that description or are close to it. The more precise you are and the more details you offer, the better. I find that Wikipedia entries are most complete and helpful.

FOUR

Based on your description, you will learn that this flag is from Bhutan.

However, flags tell us so much more than the “name” of a place, be it city or region or country, but also about its history, or its place in history. Flags are full of symbols, many reaching back to medieval times with its heraldry and coats of arms, the symbolic use of color, the remarkable evidence of what a flag is and what it stands for: a place, a people and its culture. You’ll become acquainted with vexillology, the study of flags and their origin.

Start your travels on the internet and go where your interests lead you.

CONTINUE YOUR ARMCHAIR TRAVEL

Using the simple steps above, identify the four flags below. (More flag images will come soon.)

As you engage in flag pursuit, I encourage you to keep a record of the flag's identity and a few pertinent and memorable facts. If you have questions or comments about this program or about a particular flag, contact Follow the Flags.

d c flag 200
new mexico 400
florence 400w
Flag of British Columbia 400

Happy Travels!

Let's see. Here is some text to start the article and I'd like to make the sentence long enough to drive you crazy as well as stretch across the page in order that there is enough content that it can clearly represent a typical article where an image might appear.

Now comes the image, which is below here, unless it's...not...due to JCE's bug when attempting to center.

Following is the flag of Bhutan - wherever that is in the world. This first text is left aligned - no alignment set - just an image dropped into the page via media box, without any dimensions or additional settings.

flag of Bhutan 400w

In the above image I've removed the dimensions and allowed the image to default left alignment. It displays as intended.

The image remains on the page. It's not linked to a popup and the alignment of the image remains default left.

This page is also in a completely different template - one that is standard with Joomla (Beez3). So we can rule out the template in my other project - "live site".

Next, it's the same image, but this time it's been centered by using the editor "Align center" from the first row of icons in the editor.

flag of Bhutan 400w

The above images is also linked - via media box - to a larger image. That second image also contains the image dimensions, which I never allow in any of my images.

The next image is the same as the one above, but with the image dimensions removed, centered using the editor, and linked to a popup. But, as you...cannot...see, the image disappears once I remove the dimensions.

flag of Bhutan 400w

Technically, you should see 3 images on this page.

If you DO see 3 images, refresh the page. I did see the third image when I returned to this page after being elsewhere. But when I returned, saw the image, I refreshed the page and the image disappeared...again.