Wrox Programmer Forums

Need to download code?

View our list of code downloads.

Register | FAQ | Members List | Calendar | Search | Today's Posts | Mark Forums Read
BOOK: Beginning CSS: Cascading Style Sheets for Web Design ISBN: 978-0-7645-7642-3
This is the forum to discuss the Wrox book Beginning CSS: Cascading Style Sheets for Web Design by Richard York; ISBN: 9780764576423
Welcome to the p2p.wrox.com Forums.

You are currently viewing the BOOK: Beginning CSS: Cascading Style Sheets for Web Design ISBN: 978-0-7645-7642-3 section of the Wrox Programmer to Programmer discussions. This is a community of tens of thousands of software programmers and website developers including Wrox book authors and readers. As a guest, you can read any forum posting. By joining today you can post your own programming questions, respond to other developersí questions, and eliminate the ads that are displayed to guests. Registration is fast, simple and absolutely free .
DRM-free e-books 300x50
Thread Tools Display Modes
  #1 (permalink)  
Old October 15th, 2005, 09:07 PM
Registered User
Join Date: Oct 2005
Location: , , .
Posts: 2
Thanks: 0
Thanked 0 Times in 0 Posts
Default Strange behaviour with IE

I am entering the code for the JT's web page in chapter 8, and it was working fine until I got to the "text-align" code in dinner_menu.css that sets the text to center:

h3, h4, h5, h4 + p, h5 + p {
    text-align: center;

When I run this, it works in NetScape & Opera - moves the menu text to the center. But, in IE the text stayed on the left!

I set up a test div in dinner_menu.html:

        <div id='body'>
                JT's at Night
            <div id='content'>
                <img src='images/photos/dinner_plate.jpg'
                     alt='dinner plate'/>
                <div id="test">
                    <h4>Stone Crab Claws <em>Market Price</em></h4>
                            1/2 lb of claws straight from local docks served
                            cracked with a house stone crab mustard sauce.
                    <h4>Sesame Seared Tuna <em>$8</em></h4>
                            Sashimi grade yellowfin tuna encrusted in sesame
                            seeds lightly seared and served with soy dipping
                            sauce and wasabi.
                    <h4>Pita and Hummus <em>$4</em></h4>

And added a test entry to the end of dinner_meny.css:

div#test {
    text-align: center;

This moved the text to the center in IE.

As a further test, I changed the div#test text-align to right, and added the line:

text-decoration: underline;

Well, IE put the text to the right, and underlined it. Netscape & Opera both left it in the center, and underlined it!

This shows me that all three browsers reacted to the div#test code, but for some reason the text-align was over-ridden in Netscape & Opera, while IE used ONLY the align code in div#test...

Any ideas on this, or suggestions of where I might have miss-entered the code, would be helpful. I have, BTW, gone through the code 5 times trying to find any errors.

  #2 (permalink)  
Old October 15th, 2005, 09:24 PM
richard.york's Avatar
Wrox Author
Points: 5,506, Level: 31
Points: 5,506, Level: 31 Points: 5,506, Level: 31 Points: 5,506, Level: 31
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
Join Date: Jun 2003
Location: Camby, IN, USA.
Posts: 1,706
Thanks: 0
Thanked 6 Times in 6 Posts

I guess it'd help you to know that I totally ignored Internet Explorer until Chapter 18.

The problems you're having have to do with the fact that Explorer 6 doesn't support the adjacent sibling selectors in the rule "h4 + p" and "h5 + p".

In Chapter 18 I present how to implement a javascript called "IE7", which brings CSS 2 selector support to Internet Explorer 5, 5.5 and 6 (among other things that Explorer doesn't support natively).

My reasoning behind this was that I wanted to demonstrate how CSS works in browsers having the most CSS support possible. Though I recognize this isn't very useful since 90% of the world uses IE6 to browse the internet. I addressed that by giving Internet Explorer a Chapter of its own at the end of the book that demonstrates common CSS bugs, and how to use Dean Edwards's IE7 JavaScript to increase CSS support in IE without your users needing to upgrade or do anything on their end. After Chapter 18, the JT's website looks pretty much the same between IE 5.5, IE 6, Firefox, Opera, et all. Though admitedly, I was using an earlier version of the IE7 javascript when I wrote the book, so some things may have changed since then using a newer, faster, more stable version of that javascript.

Let me know if you have any more questions.


Mail_IMAP: A PHP/C-Client/PEAR solution for webmail
Author: Beginning CSS: Cascading Style Sheets For Web Design
  #3 (permalink)  
Old October 15th, 2005, 09:49 PM
Registered User
Join Date: Oct 2005
Location: , , .
Posts: 2
Thanks: 0
Thanked 0 Times in 0 Posts

OK, that makes sense - thanks! I've managed to avoid IE for quite some time, but it looks like I'll need to use it at least for testing - as this situation showed me! And it's good to know there are some work-arounds for any problems like this.

And it's always good to know I wasn't really screwing up...




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are Off
Pingbacks are On
Refbacks are Off

Similar Threads
Thread Thread Starter Forum Replies Last Post
Strange Behaviour VeganMan BOOK: Beginning ASP.NET 3.5 : in C# and VB BOOK ISBN: 978-0-470-18759-3 9 April 14th, 2008 12:16 PM
Strange TextBox Behaviour Jim Rogers Pro VB.NET 2002/2003 0 September 12th, 2005 08:13 PM

All times are GMT -4. The time now is 11:47 AM.

Powered by vBulletin®
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.
© 2013 John Wiley & Sons, Inc.