Re-imagination or Re-Booting

User 184085 Photo


Ambassador
1,707 posts

With all the movies of my youth being Re-imagined or Re-booted as of late, I decided to re-imagine my own site, aside from Opera not playing nice with margins is seems to be flowing good.

Comments and suggestions are welcome, just click the link bellow.
Volunteering to help :)
http://www.tbaygeek.ca
My HTML play area
http://www.tbaygeek.ca/test/
User 471275 Photo


Ambassador
1,130 posts

Hi Dave, looks good.
A suggestion personally I would make the font on the menu on top bit larger and use the same font as used in the menu on the left hand side.
:)

User 187934 Photo


Senior Advisor
20,271 posts

Hi David, As usual your doing a fine job.:) I'm thinking darker background. Seems a little washed out to me.:)
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 474778 Photo


Registered User
215 posts

Dave speaks broken Latin in cyberspace.
halfnium -AT- alum.mit.edu
Yes, I looked just like that in 1962.
User 184085 Photo


Ambassador
1,707 posts

All great ideas... thx
Volunteering to help :)
http://www.tbaygeek.ca
My HTML play area
http://www.tbaygeek.ca/test/
User 2073552 Photo


Registered User
1,625 posts

I will have to say that none of the links on the Menu Work, maybe you have not finished those yet?

As for the HTML5 everything looks good but for one thing. Header, sections, article are now HTML root items. So in the CSS you can call them directly.

You have id's in most of those which is no longer needed. You can just style the names themselves.

Like

header {background:#fff 0 0 fixed no-repeat}

and so forth.

But the site looks great.

I would agree with Eric though, it does need a little contrast. Maybe a different Background?
"An Apple doth not fall far from its tree, yet an orange does."

https://lbwebsitedesign.com - Responsive Web Design & Web Hosting Services.
http://helpsite.sirage.com - HTML5, CSS3 and CC Help Video Blog.
User 184085 Photo


Ambassador
1,707 posts

@sirage

Yes I trid the header styling directly and it works great, but when I put in the article with it's header and such it picked up on the style for the page, so I played and thought I would need more than one class of header and thought well if I was using it only onece on the page than for the main header on the page I would use an ID and then for all subsequent headers on the page I would style them directly.

working on the suggestions today, will update but keep the suggestions coming, it is all good for learning :)
Volunteering to help :)
http://www.tbaygeek.ca
My HTML play area
http://www.tbaygeek.ca/test/
User 184085 Photo


Ambassador
1,707 posts

One maddening thing is IE doesn't support text shadow so some really cool plans I had will not work without some java (or graphics).
Volunteering to help :)
http://www.tbaygeek.ca
My HTML play area
http://www.tbaygeek.ca/test/
User 122279 Photo


Senior Advisor
14,648 posts
Online Now

david wilson wrote:
@sirage

Yes I trid the header styling directly and it works great, but when I put in the article with it's header and such it picked up on the style for the page, so I played and thought I would need more than one class of header ... :)


Not knowing exactly what you want to style differently in the article than the page itself, but some time ago I had some instances of rounded corners applied to images, and it applied to EVERY image, also the ones where I didn't want the the rounded corners, in this case some flags, which were also images. So I wrote it this way:

img {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
}

.flag {
-webkit-border-radius: 0;
-moz-border-radius: 0;
-o-border-radius: 0;
border-radius: 0;
}


Maybe you can apply something similar to whatever you need to style differently.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 184085 Photo


Ambassador
1,707 posts

@inger:

Yup, planning something similar now

header {
/*create a space to hold the header content */
width:100%;
height:75px;
margin-left:auto;
margin-right:auto;
background-image:url('../images/html_css_logo.png');
background-repeat:no-repeat;
background-position:bottom left;
}
#articleheader{
height:25px;
background-image:none;
}
Volunteering to help :)
http://www.tbaygeek.ca
My HTML play area
http://www.tbaygeek.ca/test/

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.