Web Weather > Weather Website PHP/AJAX scripting

Easy way to add rounded corners to Saratoga Templates

<< < (2/4) > >>

SteveJ:

--- Quote from: miraculon on February 04, 2015, 03:05:37 PM ---
--- Quote from: mcrossley on February 04, 2015, 02:06:02 PM ---On my tablet your temperature figure appears in the top right of the browser window, outside your 'rounded' container. Also the 'wide' mode does not appear to work?

--- End quote ---

I had the same thing happen with the temperature running off the proper location, and I reverted back to the original code. I have a graphic at the top of my page, does that cause this issue?

Greg H.

--- End quote ---

Hey, Greg. You probably saw my first post, which was much more complicated and caused the temp to pop out. Try the simplified approach with the attached zip file, and lemme know if that works! :)

EDIT: I just checked the HTML source on your site and the simplified version should work for sure. :)

miraculon:

--- Quote from: SteveJ on February 04, 2015, 03:15:30 PM ---
--- Quote from: miraculon on February 04, 2015, 03:05:37 PM ---
--- Quote from: mcrossley on February 04, 2015, 02:06:02 PM ---On my tablet your temperature figure appears in the top right of the browser window, outside your 'rounded' container. Also the 'wide' mode does not appear to work?

--- End quote ---

I had the same thing happen with the temperature running off the proper location, and I reverted back to the original code. I have a graphic at the top of my page, does that cause this issue?

Greg H.

--- End quote ---

Hey, Greg. You probably saw my first post, which was much more complicated and caused the temp to pop out. Try the simplified approach with the attached zip file, and lemme know if that works! :)

EDIT: I just checked the HTML source on your site and the simplified version should work for sure. :)

--- End quote ---

I'll give it a try. Thanks.

Greg H.

miraculon:
Much better, no sharp edges for added safety!   \:D/
Seriously, I like the look.

Thanks,

Greg H.

SteveJ:

--- Quote from: miraculon on February 04, 2015, 03:33:41 PM ---Much better, no sharp edges for added safety!   \:D/
Seriously, I like the look.

Thanks,

Greg H.

--- End quote ---

Hey, Greg. You're welcome! Just checked your site and it looks great!

If you like the rounded look, and you want to try rounding the corners of your header graphic to match, just edit your top.php and find the line that says:


--- Code: ---<a href="index.php" title="Browse to homepage"><img style="border:none;" src="http://www.rogerscityweather.com/SSWbanner.png" width=772</a>
--- End code ---

Then add some border-radius to the img style.

And while you're in there, if I may be so bold as to suggest it, you might want to consider adding just a single pixel of padding to the top of the image, to better center it vertically in that header.

So that entire line would read:


--- Code: ---<a href="index.php" title="Browse to homepage"><img style="border:none;border-radius: 12px;padding-top: 1px;" src="http://www.rogerscityweather.com/SSWbanner.png" width=772</a>
--- End code ---

Give that a shot and lemme know what you think! :)

SteveJ:
I promise I'm not picking on ya, Greg... but I had ONE MORE idea for you.

Add this line at the bottom of your weather-rounded-corner.css:


--- Code: ---.headerTitle {text-align:center;}
--- End code ---

That will make your header graphic horizontally centered on the page in both the narrow AND the wide versions of your templates. :)

Navigation

[0] Message Index

[#] Next page

[*] Previous page

Go to full version