CSS - Css Reference Book
Can anyone recommend a reference book. I have the Jeffrey Zelman book but would like something that covers a bit more detail. Is the Eric Meyer on CSS any good?
cheers, steven. Similar TutorialsI have some expereince with Style Sheets but would like a more in depth knowledge of CSS. Do any of you have any good book recommendations that cover CSS? I've been messing around with CSS for a little over a month now. I've seen a lot of sites created with CSS and I'm convinced it is the correct way to design web sites. Although there is a vast amount of resources out on the web, I've become somewhat frustrated with trying to implement CSS. Mainly, it seems that getting CSS to work in both Firefox and IE requires you to sell your soul to Lucifer and devote your life to the black arts. So, I want to just stop trying to write pages and get a good book on CSS. There are tons of them out there which is making it hard for me to decide. I usually go with the O'Reilly book's but the CSS one has bad reviews on Amazon. I'm just looking for some input on what books you guys would suggest. Thanks in advance. I've been designing web pages for 7 years now, using layout tables. I realize that it's time to let go with them now. Do you recommend any good book about this? I've red Ben Henick's article on Alistapart (http://alistapart.com/articles/12lessonsCSSandstandards). Do you know if he has written any books about the topic too? Hi all, Does anyone have any good suggestions for a CSS book? I'd like to buy an all in one, that will teach me CSS. Thanks for any help Thus far I've done all of the CSS courses on lynda.com and have read css Zen Design and Transcending CSS, both GREAT books. What would be a good "next step book" into advanced CSS coding or have I done it all? hi. looking for a good book to learn css, which does *not* labor ie6 hacks, since none of my readers use ie6 any longer. i have read the head first book on xhtml/css, and now looking to expand my knowledge on css to include strong fundamentals, so i can move onto more cutting-edge stuff. a friend recommended css mastery, but this book was published in feb 2006, and ie7 was released nov 2006, so i don't see how it could be considered applicable to current browsers. there are so many to choose from. again i'm looking to learn strong fundamentals, without the need to spend time learning ie6 hacks. thanks. Hi guys, It's hard for me find a good book that teachs Photoshop in a way that a CSS designer need. All the good strategies to define wireframe templates I got it from mostly blogs. So, I wonder if it's any book where I could learn and master this techniques in Photoshop? (Also a good video tutorial it would be helpfull) Best to all Demian Hi all, new css user here and have a slight problem. I am trying to change the color of the 'post date' on my forum that i am creating. In the source code for this area, there is no div id, but just three classes namely, "top-post forum-post clear-block", "post-info clear-block", and "posted-on", with the first being the most outer class. In my css sheets there are references to the latter two classes, but adding 'color:#fffff', does not change the text color. I have tried listing them all from outer to inner and then declaring the color but also this did not work. I am using drupal and the advanced forum module, and saw using inspect element that another site just had the color specified under 'posted-on', and it was working, but not for me. Even with an !important tag, it just comes up with an exclamation mark on the 'inspect element. I was wondering if anyone had any suggestions as to how to change this? Any help massively appreciated! Hi I am new to flex and i am suppose to change the css file so that it references a a swc file instead of an programmatic skin. I know the syntax is classreference... for the action script. I just want to to know what i should replace it as. Thanks I ran into this very strange problem. CSS reference works on first load, but not on subsequent postbacks. I stared at it for whole evening not sure what to do, hope some of you have seen this before. Here's code fragment: <%@ page language="java" %> <%@ taglib uri="/WEB-INF/struts-html.tld" prefix="html" %> <%@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic" %> <%@ taglib uri="/WEB-INF/struts-bean.tld" prefix="bean" %> <%@ page import="com.aa.samples.constants" %> <%@ include file="includes/header.jsp" %> <!-- REF: TabPane http://webfx.eae.net/dhtml/tabpane/tabpane.html --> <html:html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf8"> <title>Login Page</title> <link rel="stylesheet" type="text/css" href="../pages/includes/common.css" /> </head> <body> <script type="text/javascript" src="includes/tabpane.js"></script> <link type="text/css" rel="StyleSheet" href="includes/tab.webfx.css" /> <div class="tab-pane" id="tab-pane-1"> <script type="text/javascript"> var tabPane1 = new WebFXTabPane( document.getElementById( "tab-pane-1" ) ); </script> <div class="tab-page" id="tab-page-0"> <h2 class="tab">Login</h2> <html:form action="/authenticateUsersAction.do"> <table class=TABLE > ... and the rest of it ... Thanks in advance! Norman Fung Hi, I have a script that refers to a css file (cbw.css). I want to place the css file in a subdirectory but it does not work. If I place it root directory, it works. I even tried referring to entire url, and it still does not work PHP Code: echo "<head>"; echo "<link media='screen' type='text/css' href='127.0.0.1/phpfusion7/cbw/css/cbw.css' rel='stylesheet'/>"; echo "</head>"; but if I put the url directly in the browser, it brings up the css file, so I know that the reference to the directory is correct. Thanks in advance. UPDATE Found answer - link to images in css file was incorrect. Hi, I am trying to remove the annoying url and page numbers that appear at the bottom of a page when you print a website - I want to do this using CSS so that anybody who prints my site wont get those annoying references, not change my browser. Anybody got any ideas on how to do so? Dom. Really basic question. I've created a CSS text class. How do I reference it to apply to a text sample? I've been using this page as my guide: http://www.htmlgoodies.com/beyond/css/article.php/3470231 But they only reference commands such as <I class="name"> and <U class="name">. I don't want to add any Italics or Underlines, so how do I only reference the class? This problem is in Internet Explorer. Here's the first page that looks the way it should: http://www.invistation.com/invite_me/contact.php And here's the other page, that references the same css file, but rendered differently: http://www.invistation.com/invite_me/resetpass.php My CSS File: http://www.invistation.com/invite_me/css/index2.css What gives? It doesn't make any sense why the form on the resetpass page is shifted more to the right than the form on the contact page. I'm using the same div for the two forms. Hi! I need a very good CSS2 quick reference where I can rapidly see what is supported in which browsers and a short description of the property. Thank you! I am creating a standalone (included with <script src>) script to display a slideshow of images, and need the images' container DIV to resize to the height and width of the largest image, PLUS the border width. I can get the height easily enough, but the border is giving me problems. The code I'm using now is: Code: function getcss(myclass,element) { var CSSRules; if (document.all) { CSSRules = 'rules'; } else if (document.getElementById) { CSSRules = 'cssRules'; } for (var i = 0; i < document.styleSheets[0][CSSRules].length; i++) { alert ('.' + document.styleSheets[0][CSSRules][i].style['border'] + '.'); if (document.styleSheets[0][CSSRules][i].selectorText == myclass) { return document.styleSheets[0][CSSRules][i].style[element] } } } function InitializeImageRoller() { for (var q = 0; q < Files.length-1; q++) { var hidden = eval('hiddenpicture' + q); if (MaxW < hidden.width) { MaxW = hidden.width } if (MaxH < hidden.height) { MaxH = hidden.height } Container.style.height = MaxH; Container.style.width = MaxW + getcss('Container','borderWidth'); hidden.style.display = "none"; } } right now I'm testing, and in the first function, I have a line " alert ('.' + document.styleSheets[0][CSSRules][i].style['border'] + '.');". This works fine, but returns ALL the properties of the border. I need it to only give me the width. What should the ['border'] be changed to to accomplish this? Greetings all, Firstly, I am just now starting to use CSS instead of tabled layouts. I must say I am impressed by the power of CSS, but am still learning the ins-and-outs of it. I was wondering if there are any good references/books you'd suggest purchasing or looking at online? Now for my specific question. For my simple page project I am using to learn CSS, I have a <div> that denotes the header. This is supposed to simply have a small .jpg image on the left and some text on the right, like this: ___________________________ |[ i m a g e ]....................text | However, it comes out looking like this: ___________________________ |[ i m a g e ]..........................| |.....................................text| I suspect it is due to the align: right of the text, but am not sure how to correct it. Relevant snippets of code: testpage.html Code: ... <div class=header> <img src="image.jpg"><h1>TEXT</h1> </div> ... style.css Code: ... #header{ background-color: #FFF; border: 2px solid #666666; width: 860px; margin-left: auto; margin-right: auto; margin-top: 30px; margin-bottom: 0; } #header h1{ text-align: right; margin-right: 20px; font-style: italic; letter-spacing: 3px; } Thanks for any advice. |