Forum Replies Created
-
> #header div.search input.submit {
> style stuff here;
> }
Well, the cascading part of Cascading Style Sheets means that higher level stuff pertains to lower level stuff, and so on, and so on.
So from the right, an input element, with a class of submit, but only if it’s in a div with a class of search and then only if it’s in an element with an id of header.
So, based on that, the markup in the php file should look something like this:
<div id="header">
<div class="search">
<input class="submit" foo="bar" blah="blarg">Does that make sense?
> I’ve never seen the “div” used like this, and I’m not sure what the “input.submit” is.
The div.search just ties the search class to the div element (man I hope I’m not mixing up my terminology here…) So, if you had another element on the page, maybe a <p> with a class of search, like so
<p class="search">This div.search would not apply to this element, because the .search was tied to the div element. Same exact thing applies to the input.submit: only an input element with a class of submit will be affected by that specific CSS.
> Also, it’s not clear to me how the “return” button code comes last in the
> php file, but the button displays above/before the login stuff.
I’m afraid I don’t know enough about it to figure that one out. Sometimes, when it works, it’s best not to question why
One thing that helps immensely with the CSS, for me anyway, is to use Firefox with the Web Developer add-on from Chris Pederick. You can hover over an element on the page and display the CSS classes and ids that apply to it, then click and see the actual CSS. You can also make changes to the CSS in the browser and see them immediately, then once you’ve sorted them out, just paste those local changes into the CSS for your template.
http://www.mozilla.com/en-US/firefox/
https://addons.mozilla.org/en-US/firefox/addon/60
Also, be sure to validate the XHTML and CSS both, to ensure the things you’ve done are in order:
http://jigsaw.w3.org/css-validator/
Those two tools are linked from the Web Developer Toolbar.
You will find with CSS there are a lot of invalid things in the stylesheet that don’t hurt anything: they make things look better in some browsers, but don’t do anything and don’t harm anything in other browsers. When adding things to your templates, I would at least validate the XHTML.
HTH.
