Well thats a good question :) Work with your structure, maybe the structure of the WP-theme Sandbox can help you
http://www.plaintxt.org/themes/sandbox/ Christian Roque Geldres -----Mensaje original----- De: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] En nombre de Stephan Wehner Enviado el: martes, 07 de noviembre de 2006 02:17 Para: [EMAIL PROTECTED] CC: [email protected] Asunto: Re: [css-d] HTML prepared for Branding Thanks a lot for your reply. We want to be able to offer a lot of branding options to make the pages look similar to a clients own home page, for exampe, In this sense we want to "show the world the power of CSS" as well. So I thought it would make sense to follow the same path as csszengarden.com and add extra code. You say "You can do the same". But I am not sure how to do that: what extra code is good to add. I thought maybe someone else went through the same. See you, Stephan On 11/7/06, Christian Roque Geldres <[EMAIL PROTECTED]> wrote: > -----Mensaje original----- > De: [EMAIL PROTECTED] > [mailto:[EMAIL PROTECTED] En nombre de Stephan Wehner > Enviado el: martes, 07 de noviembre de 2006 01:49 > Para: [email protected] > Asunto: [css-d] HTML prepared for Branding > > Hi there, > > I'm currently working on developing the HTML for a website which is > going to be deployed for several clients. These clients will be > offered a branding option. > > Now, I'm finding all kinds of little CSS tricks here and there, which > use extra spans and divs, so that a page can be made to look prettier. > Rounded corners here, another shade of a border there. The spans and > divs are only introduced to let CSS have another hook. > > For example, I am currently looking at HTML like this > > <div id="pagefooter"> > <div class='right'> > <div class='content'> > </div> > </div> > </div> > > > #pagefooter { > color: #ffffff; > background: url('/images/box-footer-left.png') no-repeat top left; > height: 6px; > padding-left: 6px; > } > #pagefooter .right { > background: url('/images/box-footer-right.png') no-repeat top right; > padding-right: 6px; > height: 6px; > } > #pagefooter .content { > border-bottom: 1px #004a94 solid; > padding-top: 5px; > } > > Each one of these contributes to a footer which has rounded corners on > the left, and on the right. > (This could be done with additional spans, a la Rico Corner for > example and do without images.) > > (The header looks similar) > > If another client came along, the #pagefooter .right #pagefooter > .content may be left unspecified in the CSS, if the #pagefooter > specification allows enough flexibility. > > So my question is, is there a guide of how many extra hooks to include > in the HTML to allow further CSS styling. And what kind of hooks? It > would be nice to serve the same HTML to all clients of course. But I > don't want to run into troubles later on where just another span here > or there might allow required effects that are difficult without. > > If we look at the HTML from csszen-garden.com for example we can see a > layout of > > ---------------------------------------------------- > <div id="container"> > > <div id="intro"> > <div id="pageHeader"> > <h1><span>css Zen Garden</span></h1> > <h2><span>The Beauty of <acronym title="Cascading > Style > Sheets">CSS</acronym> Design</span></h2> > </div> > ---------------------------------------------------- > > and at the end > > ---------------------------------------------------- > <!-- These extra divs/spans may be used as catch-alls to add extra imagery. > --> > <!-- Add a background image to each and use width and height to > control sizing, place with absolute positioning --> > <div id="extraDiv1"><span></span></div><div > id="extraDiv2"><span></span></div><div > id="extraDiv3"><span></span></div> > <div id="extraDiv4"><span></span></div><div > id="extraDiv5"><span></span></div><div > id="extraDiv6"><span></span></div> > ---------------------------------------------------- > > > So there seems to be some validity to adding divs and spans which are > not dictated by content, but just for the sake of allowing > customizability. > > > > Thanks a lot, > > Stephan > ______________________________________________________________________ > css-discuss [EMAIL PROTECTED] > http://www.css-discuss.org/mailman/listinfo/css-d > IE7 information -- http://css-discuss.incutio.com/?page=IE7 > List wiki/FAQ -- http://css-discuss.incutio.com/ > Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ > > CSS Zen Garden has that lots of extra code because the object of the site > was to shoe the world the power of CSS, not to show how to make a semantic > markup. > > You can do the same, but the HTML will not be so semantic > > Christian Roque Geldres > > > ______________________________________________________________________ > css-discuss [EMAIL PROTECTED] > http://www.css-discuss.org/mailman/listinfo/css-d > IE7 information -- http://css-discuss.incutio.com/?page=IE7 > List wiki/FAQ -- http://css-discuss.incutio.com/ > Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ > ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
