From_Photoshop_to_HTML

Page 109

109

Coding the CSS

</div> <!-- end footerWrap--> <script src=”http://ajax.googleapis.com/ajax/libs/ jquery/1.4/jquery.min.js” type=”text/javascript” charset=”utf-8”></script> <script type=”text/javascript” src=”js/scripts.js”> </script> <script type=”text/javascript”> Cufon.now(); </script> </body> </html>

The “Work” page raises a new challenge. Up until now, our pages have had two columns within the main content. However, now we only have one column. As a result, we need to revisit our CSS file and make a few updates and changes. We must find a way to make the “primaryContent” div a stated width for the Home and About pages, but 100% wide for the single column pages. NOTE: Notice how we don’t return to the HTML to make adjustments to the “presentation” of the page. That’s a job for CSS! Let’s use the “body” trick again! Find the “body” tag and add a new class attribute. <body id=”subpage” class=”single”>

Next, open your CSS file, find the #primaryContent declaration, and just under it, append a new style.


Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.