input /* Is this block also included in "#registrationForm" */
{
background-color:white;
width:200px
}
h1 /* Is this block also included in "#registrationForm" */
{
font-style: italic;
padding-left: 50px;
}
If either input or h1 elements are within the #registrationForm, table, then all rules for "#registrationForm, table also apply to input and h1?
On the other hand, if input or h1 are outside "#registrationForm, table, then none of the "#registrationForm, table rules apply?
Not quite. Generally speaking, rules apply only to the element(s) for which they are defined. There are some cases where rules cascade down to children (nested items) but I don't have a list handy.
Pavilion wrote:On to another portion of your css file
p.borderbx seems to adhere to the same rules as .borderbx, so... I'm assuming they are related?
What does the period before borderbx mean?
And how is it related to the period within p.borderbx mean.... and what does the p mean?
The dot denotes a class. So p alone means the rules are to apply to all paragraph (<p>) elements. .borderbx rules will apply to any element with the class borderbx. As I'm sure you've now surmised, p.borderbx rules apply to any paragraph elements with the class borderbx. In the case presented above, I wanted some rules to apply only to paragraphs with the borderbx class so that the class could be applied directly to the paragraph rather than wrapping it in a div, and to avoid having to declare another class and needlessly duplicating a lot of code.
Your answers have been very helpful. I've played with the different css formats and playing with them has helped to visualize the different elements and rules. The final php and css files in my project reflect all your changes. For now, I'm gong to let the formatting questions still muddling about in my head rest. Sometimes it's best to actually work with things to understand them better. So... I'll go forward with learning how to build a log-in page and learn more as I go. I do have one question though. Following is a screen shot from my register.php file:
You'll see in the screenshot that <fieldset></fieldset> is highlighted in purple. Generally when I double-click on a beginning tag, then both the begin and end tags are highlighted. This is not happening with the
Just an observation about this: it picks up the php code sections in the html, if you were to remove the <?php $_SERVER['PHP_SELF']; ?> from the action atrribute it will behave like the other elements do.
“Don’t worry if it doesn’t work right. If everything did, you’d be out of a job.” - Mosher’s Law of Software Engineering
true, i'm actually only hinting at it in terms of the issue pavilion is experiencing with notepad++ and the highlighting, pavilion shouldn't modify anything to satisfy notepad++'s quirks
“Don’t worry if it doesn’t work right. If everything did, you’d be out of a job.” - Mosher’s Law of Software Engineering
OK - thanks to both of you. It had occurred to me, that might be the issue. Just wanted to make sure nothing was "off" with the code itself.
I do have one other formatting question before going back to building a login page. I've read about using a very narrow background image with "repeat" to fill in the whole page. I understand this loads faster and if your page needs to scroll this works better than just one screen sized image. But... I can never make the "repeat" work. Whenever I try to do something like this my background has lines between the repeated images. Following is a screen shot:
Celauran wrote:That black line across the bottom is problematic.
Yes - you are right it is. That black line does not show up in my photo editor. It only shows up in situations like this - or on my website. So... I've no idea how to get rid of it. I'm working in my photo editor right now (it's nothing fancy). But... one should think there would be some kind of option that I can set to take away any border.
Beyond that line though - the image is still not repeating with the syntax currently in use. The image just shows at the top of the page - and that's it. Again, the current syntax is as follows:
Like I mentioned earlier, you need to specify the axis to follow. Background images tend to be vertically oriented, so you'd use repeat-x. Since yours is horizontally oriented, you'd want repeat-y. I was able to edit out the black bar at the bottom of the image, but that didn't solve the problem. The background still wasn't smooth.