Image positioning

[avoorpool]

Hi Jacques,

I hope you've managed the problems with the virus. Doesn't sound good to me, and probably a lot of extra work!!
I've a "simple" question for a guru like you, but I'm struggling with it  :cry:
Since I've added a bit more text to my front (=now) page, there is space to add an additional box. I've managed this as well as to implement a nice (free) Google gadget in the correct size, the World Sunlight script. It's nice since it is directly next to the Sunrise & Moon info.
Please have a look at it.
The only thing is that the image is not exactly in the box it should be (too high).
I've looked at the padding info on several tutorial web pages and I do understand the positioning (pixel shifts) however on my page (with the script in place) I don't know where to put the correct padding info (it only has to shift approx 10 -15px down!!!)
Thanks for your help!!
BTW: I added the flagcounter to my site 6 days ago and today I already passed the >1000 pageviews  

Thanks,

Arthur

[Mr.Meteo]

Hi Arthur,

When we have strange problem, we think too often about virus  :roll:
In my case, it was due to my "baby" (20 years girl)... I've downgraded
my video card to give her a more "gamers" capable card and take her
old one and discover... that card hate Windows 7 Aero Style!
(bug when resize a browser -IE or Firefox - window)

Then, I'm back on my feet... For your "esthetic" problem, you could go
simply by adding a bottom margin to your box title, like this:

Code: [Select]

<h2 style="margin-bottom: 20px;">World Sunlight Map</h2>For your info, your on good way with padding, but without margin, it miss
a lot. You could remember more easily if you allways think about a box
(even if there is no lines surrounding), each and every command in html
(<p>, <div>, <h?>, and so on) is included in a box!

Then, spaces INSIDE the box is padding
and spaces OUTSIDE the box is margin

boxes have 4 sides, top, right, bottom, and left in that order.
in this case we just want to act on bottom, then we use margin-bottom

Hope this help,

Regards,
Jacques

Ps. Your "Gadget powered by Google" feels long to me, shrink the phrase
or inverse image and text to have "Gadget powered by" (image of Google)

[avoorpool]

Hi Jacques,

Good to hear it wasn't a virus, but "just" an unwilling video card (I upgraded my PC 2 month ago to W7 and x64, fortunately everything still works well.
Thanks for your notes!!
However, I had some "scary" moments.........
1) When I modified IndexT, my bottom of the page was all messed up (lose ends and no more flag counter displayed).
2) a second attempt showed a line in the middle of the page and colours were off....

Now when I look into the IndexT page, I see that the box above (moon phase) does not have anything inbetween the text, but just <h2>moon phase</h2>
The next line however shows the position I guess. (in this case padding..px)
In my new bow (World Sunlight Map) I would like to keep the text and position as it is, but need to slightly move the image (= script) to have it better centered, so shuld this be padding as well?
I've tried several scenarios, but nothing moves, so obviously it's not the correct thing I've done.
I've tried:
<script style="padding-top ..px ..px ..px ..px" scr=xxxxxxxxxx></script> but that didn't work..
For now I keep it as is (don't want to mess up again, but do you have any suggestions?

Thanks,
Arthur

[Mr.Meteo]

Hi Arthur,

What I suggested you with margin is supposed to work on
world sunlignt map. But now that I know that you are using FF,
I'll suggest an other add-on... HTML Validator v.0.9.5.1, it will
display on buttom border, all errors encountered in your pages.

Often, errors have no or little impact on pages, as browsers are
clever. But some errors are misinterpreted by browser causing
display problem. then an other add-on so udeful is Firebug v1.9.2
This add-on could inspect near everything in a page.

Your page contain 68 errors, but don't be affraid many times
1 error solved could correct many other errors! These add-ons
will help you very much to learn html as any errors are explained.
When I look to you page I'm using them to see code and try
some things before post you an answer... With that I don't need
your code or acces to your account as I'm seeing anything and
is able to modify it (on my side only no save possible, for sure)

Then, when I margin on your <h2> title all is beautiful here .

Regards,
Jacques

[avoorpool]

Hi Jacques,

Thanks for your explanation. You scared me telling me about the errors  
I did a bit of an "un-ethical" html implementation I guess, by entering a <br /> below the <h2> line.
It dropped the script line to the right position.
Also I changed to a Mollweide projection of the World map, and now it looks OK...!!??
I will look into the suggested errors (and display).

Thanks,

Arthur

[avoorpool]

Hi Jacques,

1) Maybe you can explain a bit more about the errors that are present on my pages.
I checked this with a violation program, and many of them are items not even touched by me, but coming directly from Cumulus inputs??
i.e: I use the "current" input on the main Cumulus screen (Current Observations) and when I do so, it shows an error in the validation page (characters or anything like that).
Are there any consequences having errors on the page??

2) I have changed the Moon image on my Index page into a script from Moonphases. (I was not impressed with the copied Cumulus image of the Moon (also having a dedicated page for the Moon on my site).
Same as with the World Map image, I want to shift the entire image (= script) a few pixels to the left.
I've tried many possibilities in the html tutorial page (= practice page), however I can't get it to shift!!!!!!
What's the way to do so??
(BTW: The embedded image on the World Map is Google, and I can't get tid of that!!)

Thanks

Arthur

[Mr.Meteo]

Hi Arthur,

First of all, don't be too affraid about errors, many "commercial" pages
have errors. It's a bit perfectionist to want 100% clean pages! Like I told
you, good pages don't need to be "guessed" by browser to acheive display
perfectly. You know now, a bit to the left or the right and pages are little
less attractive! Myself I have a goal to have perfect pages, as many pages
have to rely on perfect alignment, like gauges page that contain many holes
under which gauges are aligned... one bit in the wrong direction and gauges
are "junks"... and finally it's known, "quality" pages are ranked better on
search engines (Google and others)

I think you haven't install Firefox Addon I told you before!
(HTML Validator v.0.9.5.1), this one is really helpful as it told you
where the errors are and some "logical" lesson about that error.
Many times, you have a link to a longer explanation. You just have
to check your bottom-right corner for errors/warnings displayed.
When you have something wrong showed (like 2 errors/1 warning)
you just click on that message twice to have your errors spotted and
explained!

For example, your "Day Length:..." phrase on main page is made with
command <td>...</td>, but that tag is for tables onlyL
<table>
..  <tr>
....    <td>
....
....    </td>
.. </tr>
</table>

For your new moon, try to shrink (smaller padding) width of these div:
<div style="padding:15px;background-color:#000000;border: 1px solid #000000">
..<diiv align="center" style="padding:16px;padding-bottom:6px;padding-top:16px;border: 1px solid #000000">
(for this last div, don't repeat padding, use long way padding: 16px 16px 6px 16px...
4 numbers for, in clockwise order: top, right, bottom, left)

Finally, to study web best, I use http://w3schools.com it's quite simple with short
explanation, but..."Try me" buttons on everything.

Your on good way Arthur, your site is already one of the most complete, for
Weather Blues template!  :geek:

Regards,
Jacques
Ps. Your new moon is terrific... but iPhone/iPad hate Flash (I've bought a new
Android Pad as my iPad hate - and d'on't see at all - Flash!)

[avoorpool]

Hi Jacques,

Thanks for your encouraging words!!
I like the template very much, and I think we're on the "same page" when it comes to having a "perfect" displayed web-page.
Just a bit "off" annoys me!!
Indeed I use the W3school a lot. Tonight I used it for a "test-page" (try-it) with the moonphase image (= script) and spend some time in changing the different values in padding, till in the end it all fits in the original frame and it looks great!!!!!
It's more difficult with the World Sunlight image (= script) since this has the incorporated Google message and the size of the image doesn't change, only becomes bigger, and thus outside of the original frame. I think I'll this for as it is.
My next step is to change the domain (maybe next week), so I will be able to go "Realtime". First step will be implementing the Cumulus Realtime + gauges page and see if I can get that to work.
Thanks for all your suggestions and advise!!!

Regars,

Arthur

[Mr.Meteo]

Hi Arthur,

Things coming real good, many exclusive new stuff on your site!  
You're "growing(?)" really fast!! In a few I'll have to send you to the
"Big league" (Cumullus Forum) as you'll do things I don't have experienced
(ie. Steel gauges, realtime). As no one could know all, and days have just 24h  :lol:
I've specialized myself to "Dummies", who are scarry about doing themself!

For your iPage registration, I have open a demo account with them to see what is
inside, then for user wanting to see what's inside I could share username/password.
Interface is pretty cute and attractive, all necessairy stuff are included as many
other options elsewhere.

If you plan to keep your weather site for a long time, I recommend that you take
longest possible plan, as these prices are for new users, after initial contract, prices
are between $7 and 9$/month, depends on terms.

Best regards,
Jacques
Ps. Sent acces code in mail!

[avoorpool]

Hi Jacques,

Thanks for your reply.
I always like to work in Powerpoint (with perfect display, positioning etc) and thought html was very similar.....Now know the difference, although it's getting more understandable for me (with your help!!!)
As for the Validator add on, I don't have Firefox installed. Will this work with IE 9 as well??

I checked iPage and it looks easy and clean. Most likely I will go for a 2 year term which is $84, not bad. I'll have to look into add-ons like web security and back-up features, all available for around $12,95 / year.

I assume I can copy/paste all my html files and directories from 000webhost.com to iPage once it's set up. (Don't like the idea of having the domain being taken over). I'm not sure if 000webhost.com offers a forward function for visitors (once I've closed my account with them).

Enjoy your long weekend
HAPPY CANADA DAY    

Arthur

[Mr.Meteo]

Hi Arthur,

You know, I was using IE for years now, as school IT manager I had no choice!
But when I started on web, FF imposed itself! Manyyyyyyy things doesn't exist on IE!
Then,as you're now more comfortable with web, you have to discover 2 other things

1 - ALL web "workers"  HATES IE for the fact that he is acting as the web belong to him!
But web is an Open Standard dicted by independent comity! You'll discover fastly that
your pages work well with Google Chrome, Opera and others... but "hang" in IE! Many
Tricks exist for IE, because IE doesn't respect standards!

2 - Firefox.is THE standard for developers! It has THOUSANDS addons for all tastes.
Chrome, Opera and others have some capabilities, but FF have many years of experience
On development, Chrome is good, but when you could add 1 things, on FF you have 10's!

Then one day or an other you'll switch!

To change your hosting, no problem as you aren't on complicated  things, you'll have only
To copy to your Pc and from Pc to your new site. As easy as copying a file on Pc!

Regards,
Jacques