Hi paintbrush,
I have tried to make sense out of several of the themes. They are just so complicated to me that I quickly forget where I started and get lost. I'm the kind of guy that has to take off his socks to get past ten.
So I thought: “something really easy!” Four "boxes". Simple; can be elegant; sticks to the KISS principal; I should be able to learn the basics cold; and it's sorta comparatively free.
I should be able to do that with my socks on.
I am stubborn. Just found the <F12> in Microsofts’ browser key brings up a detector dialog box. I fooled around for a bit and found that it provides a lot of information about the web page in the browser tab. Including a list of CSS items behind the page.
Cool.
Regards,
-Paul-
jPaulB
Registered User
49 posts
Jo Rice
Senior Advisor
10,951 posts
Hiya Paul,
You can easily view your css file by typing the pathway to it in the browser same as you would any other page in your website. So if it's in a css folder type:
yourdomainnamehere.com/css/nameofcssfile.css
or if it's in the root directory with the .html pages type:
yourdomainnamehere.com/nameofcssfile.css
In most browsers (not all) if you loo at the <head> section of your site at the top of the page, where the .css file is linked, that usually shows as a link and when clicked will show you the css page. Some browers do not show that as a link, but most do. If not, just use what I said above to get to it.
I would also suggest doing some tutorials for HTML5 and CSS3 or perhaps some books to read on it. I have found the book "CSS3 the Missing Manual" to be extremely helpful, and if you google "css tutorials online" you'll find many free ones that will help you learn how it works better.
Good luck
You can easily view your css file by typing the pathway to it in the browser same as you would any other page in your website. So if it's in a css folder type:
yourdomainnamehere.com/css/nameofcssfile.css
or if it's in the root directory with the .html pages type:
yourdomainnamehere.com/nameofcssfile.css
In most browsers (not all) if you loo at the <head> section of your site at the top of the page, where the .css file is linked, that usually shows as a link and when clicked will show you the css page. Some browers do not show that as a link, but most do. If not, just use what I said above to get to it.
I would also suggest doing some tutorials for HTML5 and CSS3 or perhaps some books to read on it. I have found the book "CSS3 the Missing Manual" to be extremely helpful, and if you google "css tutorials online" you'll find many free ones that will help you learn how it works better.
Good luck
Inger
Senior Advisor
14,571 posts
Paul, I would let the wrapper 'shrinkwrap' around the header, nav, container and footer - unless you want the wrapper to have a different colour than the body. Outside the wrapper you have the background colour that you give the body tag.
If you want to have the wrapper wider than what is inside it, you should create a div 'wrapper-inner' or so and place it below the header. AND leave the footer outside. The wrapper inner should have the width of the nav + container, and make it display: table; in the css. The nav and container should display: table-cell; . That will place them next to each other, and you don't have to worry about floats and clearing floats. The 'table cells' will end up smack beside each other, and that is ok, because you make the 'gutter' (the space between them) by using padding.
If you want to have the wrapper wider than what is inside it, you should create a div 'wrapper-inner' or so and place it below the header. AND leave the footer outside. The wrapper inner should have the width of the nav + container, and make it display: table; in the css. The nav and container should display: table-cell; . That will place them next to each other, and you don't have to worry about floats and clearing floats. The 'table cells' will end up smack beside each other, and that is ok, because you make the 'gutter' (the space between them) by using padding.
Ha en riktig god dag!
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Inger
Senior Advisor
14,571 posts
Oh, and one more thing: I would not set a specific height in px. If people increase the text size in their browser, the text might not have room enough. Better to set the height in %. If you want the pages to cover the whole viewport of the screen vertically, use height: 100%; on the html tag, the body tag and the wrapper tag.
Ha en riktig god dag!
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
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.
