Page Layout Using CSS
Tuesday, July 15th, 2008Here is a simple way to turn a design done in Photoshop into a webpage using HTML and CSS. Anyone can follow this video and do the same with their design.
Daily Web Design Inspiration & Ideas
Here is a simple way to turn a design done in Photoshop into a webpage using HTML and CSS. Anyone can follow this video and do the same with their design.
This one is awesome, a portfolio menu. As you hover over the small rectangles, they expand to a square where you can see the project, as you leave each it rolls back up. This was submited by one of our readers.
No, this is not Flash, this is DHTML, CSS folks. Very nicely done. Make sure to check out the live version on their website.
Go to: http://www.guerrillawebsitedesign.co.uk/portfolio.php
Need to refine your CSS skills? Are you looking for some cool tips and tricks for CS3, Acrobat, Illustrator or MS Office? If you are, then go check out the free video tutorials at Ten Ton Books! Geoff has put together some great, informative tutorials on all of the subjects listed above. Currently there are 8 free videos. I watched the first in a three part series on ‘Creatin’ CSS Layouts in Dreamweaver’ and it was great. I’d highly recommend them to anyone interested in refining their abilities in Dreamweaver.
Go check ‘em all out!
For the lab exam preparation like ccie or for Cisco Certified Design Associate, ccda you need to get skills in solving papers. Exam like Certified Information Systems Security Professional or CISSP and Microsoft Certified Solution Developer or mcsd also require some quick brainstorming techniques as well.
Here is a simple way to center a DIV on a page using CSS.
Use this:
#myDiv {
margin: 10px auto;
}
10px is the top margin. If you don’t want any margin you can use 1px, but you have to use something, else it won’t work and you will need to use the second method.
Second method:
#myDiv {
position: absolute;
width:750px;
left: 50%;
margin-left: -375px;}
Use absolute positioning.
position: absolute;
Specify the size of your div, in pixels.
width:750px;
Then you position the left edge of the div in the center of the page.
left: 50%;
And now you just moove the DIV to the left half of it’s size, half of 750 in our case is 325.
margin-left: -375px;
And you’re done.
The source site for this is: http://www.actionhead.com
I like the way the background is on this website. The design and the fixed style. This is a good example for this kind of design. Here is a CSS code for making the background fixed, so it doesn’t scroll with the page.
body {
background: #ffcc66url("graphics/bg.jpg") no-repeat fixed;
margin: 0 0 50px 0;
}