Page 1 of 2 12 LastLast
Results 1 to 16 of 17

Thread: CSS Error

  1. #1
    Senior Members' Member Matt1eD's Avatar
    Join Date
    Feb 2005
    Location
    London
    Posts
    2,462
    Thanks
    0
    Thanked
    0 times in 0 posts
    • Matt1eD's system
      • Motherboard:
      • MSI K9N6SGM-V GeForce 6100
      • CPU:
      • Athlon 64 LE-1620 2.41GHz
      • Memory:
      • 2 GB DDR2
      • Storage:
      • 1.25 TB
      • Graphics card(s):
      • Onboard
      • PSU:
      • eBuyer Extra Value 500W!
      • Operating System:
      • XP Pro

    CSS Error

    Just finished a site and it appears in IE6 & IE7 (Beta 1) to sort of add another bit of menu. Any ideas (doesn't look great having that extra bit there!)... or is this just IE being IE about CSS?

    www.janerosedesign.co.uk

    Thanks
    Matt

  2. #2
    Gaarrrrr! Dav0s's Avatar
    Join Date
    Aug 2005
    Location
    Bristol
    Posts
    1,442
    Thanks
    1
    Thanked
    3 times in 3 posts
    argh IE, always fussy

    i have no idea why it decides to write contact twice, gimme a sec and ill have a play with your code.

    edit: try taking float:left from your css on ul.navbar. now, all i get is that extra contact part when i hover over "home"
    Last edited by Dav0s; 03-02-2006 at 09:58 PM.

  3. #3
    Senior Members' Member Matt1eD's Avatar
    Join Date
    Feb 2005
    Location
    London
    Posts
    2,462
    Thanks
    0
    Thanked
    0 times in 0 posts
    • Matt1eD's system
      • Motherboard:
      • MSI K9N6SGM-V GeForce 6100
      • CPU:
      • Athlon 64 LE-1620 2.41GHz
      • Memory:
      • 2 GB DDR2
      • Storage:
      • 1.25 TB
      • Graphics card(s):
      • Onboard
      • PSU:
      • eBuyer Extra Value 500W!
      • Operating System:
      • XP Pro
    Thanks Davos,

    Tried it and it still sticks there for me (both IE6 & 7) . Funny how I actually had hopes that IE7 would be CSS compliant well I am only running Beta 1.

    Also in IE I'm getting a really annoying grey bar (a pixel or so wide) at the end.

    Cheers

  4. #4
    HEXUS.net Webmaster
    Join Date
    Jul 2003
    Location
    UK
    Posts
    3,108
    Thanks
    1
    Thanked
    0 times in 0 posts
    It's probably line breaks in your code, IE does funny things with them. Your code does need a lot of work though, lots of redundant CSS and HTML code. For W3C compliance you need to have all code in lower case and all properties in quotes e.g. class="blah" not class=blah.

    I would remove the <ul> code, it's not needed unless you have drop down menus, just use the a tag and set it to display:block. As a rough example this is reasonably close to what you have

    HTML Code
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    	<link href="stylesheet.css" type="text/css" rel="stylesheet">
    	<title>Jane Rose Garden Design</title>
    </head>
    
    <body>
    	<img src="images/titlebar.jpg" />
    	<div class="nav"><a href="index.htm">.:Home:.</a><a href="about.htm">.:About:.</a><a href="com.htm">.:Commissioning:.</a><a href="chelsea.htm">.:Chelsea 2006:.</a><a href="contact.htm">.:Contact:.</a></div>
    	<div class="container">
    		<div class="content">
    		<h2>Jane Rose Garden Design - Home</h2>
    		<p>For a garden to reach its full potential it must have a well planned structural design which must be not only sympathetic to its surroundings but also reflect the architecture of the property and the uses to which the owners wish to put it.</p>
    		<h2>Design Philosophy</h2>
    		<p>Good planting is enchanced by good structure but diminished by poor.</p>
    	</div>
    	<div class="footer">
    		<div class="right">
    			Web Design &#169; 2006 <a href="http://www.matteon.co.uk/" target="_blank">MATTEON Software</a>
    		</div>
    		<p>Contact: <a href="mailto:webmaster@janerosedesign.co.uk">Webmaster</a>
    		<br />
    		Horseshoe Green Farmhouse, Markbeech, Edenbridge, Kent, TN8 5PA - Tel. (01342) 850 872</p>
    	</div>
    	</div>
    </body>
    </html>
    CSS Code
    Code:
    body {
    	background: #dddddd;
    	color: #666666;
    	font: normal 11px Verdana, arial, sans-serif;
    	text-align: center;}
    h1 {
    	color: #8cd749;
    	font-size: 16px;
    	font-style: italic;}
    h2 {
    	color: #666666;
    	font-family: arial;
    	font-size: 11px;
    	margin: 5px 0 5px 0;}
    a {
    	color: #8cd749;}
    a:hover {
    	color: #3b4471;
    	text-decoration: none;}
    .container {
    	background: #ffffff;
    	text-align: left;
    	margin: auto;
    	width: 78%;}
    .container .content {
    	padding: 10px;}
    .nav {
    	margin: auto;
    	width: 78%;}
    .nav a {
    	background: #99ccff;
    	display: block;
    	color: #000000;
    	float: left;
    	padding: 5px 0 5px 0;
    	text-align: center;
    	text-decoration: none;
    	width: 20%;}
    .nav a:hover {
    	background: #ffffcc;}
    .footer {
    	border-top: 1px #999999 solid;
    	font-size: 8px;}
    .footer .right {
    	float: right;
    	margin: 10px 0;}

  5. #5
    Senior Members' Member Matt1eD's Avatar
    Join Date
    Feb 2005
    Location
    London
    Posts
    2,462
    Thanks
    0
    Thanked
    0 times in 0 posts
    • Matt1eD's system
      • Motherboard:
      • MSI K9N6SGM-V GeForce 6100
      • CPU:
      • Athlon 64 LE-1620 2.41GHz
      • Memory:
      • 2 GB DDR2
      • Storage:
      • 1.25 TB
      • Graphics card(s):
      • Onboard
      • PSU:
      • eBuyer Extra Value 500W!
      • Operating System:
      • XP Pro
    Many thanks Iain this is my first main use of CSS so your help is great!

    I've got a sandboxed version at www.janerosedesign.co.uk/compliantcode/ and I put in your ammended code (only on index.htm). The bar bits are lost and just left as text.

    When I ran the HTML through the validator it demanded I put in alt tags on the titlebar.jpg image and I did. It's now saying:

    Quote Originally Posted by w3c
    Line 10 column 68: document type does not allow element "img" here; missing one of "ins", "del", "h1", "h2", "h3", "h4", "h5", "h6", "p", "div", "address", "fieldset" start-tag.
    Also, since when has:

    Quote Originally Posted by w3c
    Line 21 column 64: there is no attribute "target".
    there been no such thing as

    Code:
    target="_blank"
    Thanks

  6. #6
    Gaarrrrr! Dav0s's Avatar
    Join Date
    Aug 2005
    Location
    Bristol
    Posts
    1,442
    Thanks
    1
    Thanked
    3 times in 3 posts
    hi, Iain just forgot to put display:block in the CSS for "nav"

    .nav {

    margin: auto;
    width: 78%;
    display:block;

    }

    that makes it pretty much display how you want i think

  7. #7
    HEXUS.net Webmaster
    Join Date
    Jul 2003
    Location
    UK
    Posts
    3,108
    Thanks
    1
    Thanked
    0 times in 0 posts
    you don't need it in nav, it's a div and displays as a block by default, you only need it on the <a> tag which is inline by default.

    target was deprecated in favour of rel but it also means you need javascript to convert your rel properties into new windows.

    Your sandbox environment isn't using the CSS I provided hence the problems you see.

  8. #8
    Ah, Mrs. Peel! mike_w's Avatar
    Join Date
    Oct 2003
    Location
    Hertfordshire, England
    Posts
    3,326
    Thanks
    3
    Thanked
    9 times in 7 posts
    target= isn't nice because it forces people, or rather their browsers, to do things that they might not want to do i.e. open a new window. The principle is that if somebody wants a page in a new window/tab, they will do it themselves. If you start opening new windows up by yourself, you can annoy people, confuse people, break the back button, etc.
    "Well, there was your Uncle Tiberius who died wrapped in cabbage leaves but we assumed that was a freak accident."

  9. #9
    Banned
    Join Date
    Jul 2004
    Location
    Blackpool
    Posts
    983
    Thanks
    15
    Thanked
    38 times in 20 posts
    It's saying tehre is not target= because you are giving your site a HTML doctype, if you change it to HTML 4.01 then it would probably not give you that error.

    target is depricated in XHTML.

  10. #10
    Gaarrrrr! Dav0s's Avatar
    Join Date
    Aug 2005
    Location
    Bristol
    Posts
    1,442
    Thanks
    1
    Thanked
    3 times in 3 posts
    oh, well i used your css and your code, and got the same problems as matt, when i changed nav to display:block it seemed to work :S

    but i see what you mean..so dont know why it made a difference :/

  11. #11
    Senior Members' Member Matt1eD's Avatar
    Join Date
    Feb 2005
    Location
    London
    Posts
    2,462
    Thanks
    0
    Thanked
    0 times in 0 posts
    • Matt1eD's system
      • Motherboard:
      • MSI K9N6SGM-V GeForce 6100
      • CPU:
      • Athlon 64 LE-1620 2.41GHz
      • Memory:
      • 2 GB DDR2
      • Storage:
      • 1.25 TB
      • Graphics card(s):
      • Onboard
      • PSU:
      • eBuyer Extra Value 500W!
      • Operating System:
      • XP Pro
    Quote Originally Posted by mike_w
    target= isn't nice because it forces people, or rather their browsers, to do things that they might not want to do i.e. open a new window. The principle is that if somebody wants a page in a new window/tab, they will do it themselves. If you start opening new windows up by yourself, you can annoy people, confuse people, break the back button, etc.
    Most users aren't very aware of new windows and then worry when they're taken off site.

    --------------------------------

    Quote Originally Posted by Michael
    It's saying tehre is not target= because you are giving your site a HTML doctype, if you change it to HTML 4.01 then it would probably not give you that error.

    target is depricated in XHTML.
    Will do

    --------------------------------

    Oh, I remember, got SmartFTP to vertical align and the windows swapped so I dragged the old stylesheet over the new one hence sandboxed one hadn't changed.

    --------------------------------
    What about error 1?

    --------------------------------

    Thanks all. Will re-do tomorrow

  12. #12
    Ah, Mrs. Peel! mike_w's Avatar
    Join Date
    Oct 2003
    Location
    Hertfordshire, England
    Posts
    3,326
    Thanks
    3
    Thanked
    9 times in 7 posts
    Quote Originally Posted by Matt1eD
    What about error 1?
    Try whacking the image in a div (put it into the W3 Validator, and it worked fine, but not sure about the impact on layout, if any.)

    Oh, and if you use XHTML1.0 Transitional, the target should be fine. (Actually, it is all fine as XHTML1.0 Transitional: http://validator.w3.org/check?uri=ht...onal&verbose=1)
    "Well, there was your Uncle Tiberius who died wrapped in cabbage leaves but we assumed that was a freak accident."

  13. #13
    Senior Members' Member Matt1eD's Avatar
    Join Date
    Feb 2005
    Location
    London
    Posts
    2,462
    Thanks
    0
    Thanked
    0 times in 0 posts
    • Matt1eD's system
      • Motherboard:
      • MSI K9N6SGM-V GeForce 6100
      • CPU:
      • Athlon 64 LE-1620 2.41GHz
      • Memory:
      • 2 GB DDR2
      • Storage:
      • 1.25 TB
      • Graphics card(s):
      • Onboard
      • PSU:
      • eBuyer Extra Value 500W!
      • Operating System:
      • XP Pro
    OK, thanks mike_w

    ---------------------------

    Just noticed with Iain's updated stylesheet a border at the bottom of the image has been lost.

  14. #14
    Ah, Mrs. Peel! mike_w's Avatar
    Join Date
    Oct 2003
    Location
    Hertfordshire, England
    Posts
    3,326
    Thanks
    3
    Thanked
    9 times in 7 posts
    Quote Originally Posted by Matt1eD
    Just noticed with Iain's updated stylesheet a border at the bottom of the image has been lost.
    I don't see any border on either version... do you mean a gap between the image and the stuff below it? If so, you can add a div around the image, give it an id or class, and play around with padding/margin in the CSS.

    e.g.
    Code:
    #banner{
            padding:1em;
    }
    or
    Code:
    #banner{
            padding-bottom:1em;
    }
    or
    Code:
    #banner{
         padding:0em 0em 1em 0em;
    }
    And so on and so forth...

    Oh, and while I'm at it, there is a small bit of unneeded punctuation in the nav bar. Fine for me, but not for somebody that, for example, is blind and has websites read out to them. It might read something like this: full stop colon home colon full stop full stop colon about colon full stop full stop colon...

    In fact, I should just recommend diveintoaccessibility.org. There are plenty of websites about this sort of thing around, but this one is one of the best I've found.

    e.g. New windows: http://diveintoaccessibility.org/day...w_windows.html
    Last edited by mike_w; 04-02-2006 at 09:22 PM.
    "Well, there was your Uncle Tiberius who died wrapped in cabbage leaves but we assumed that was a freak accident."

  15. #15
    Senior Members' Member Matt1eD's Avatar
    Join Date
    Feb 2005
    Location
    London
    Posts
    2,462
    Thanks
    0
    Thanked
    0 times in 0 posts
    • Matt1eD's system
      • Motherboard:
      • MSI K9N6SGM-V GeForce 6100
      • CPU:
      • Athlon 64 LE-1620 2.41GHz
      • Memory:
      • 2 GB DDR2
      • Storage:
      • 1.25 TB
      • Graphics card(s):
      • Onboard
      • PSU:
      • eBuyer Extra Value 500W!
      • Operating System:
      • XP Pro
    Thanks for the links & update.

    Will speak to the person concerned about the .:bits:. I don't think they'll be too dissapointed to see them go, as for the "_target" that may take more pursuading (has for me!!).

  16. #16
    HEXUS.net Webmaster
    Join Date
    Jul 2003
    Location
    UK
    Posts
    3,108
    Thanks
    1
    Thanked
    0 times in 0 posts
    For more info on replacing target="_blank" look here http://www.thex.com/webstandards/?p=26

    Oh and Matt1eD, your sig image is too tall. Max height is 100px unless you have dispensation from the admin team. Thanks

Page 1 of 2 12 LastLast

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Similar Threads

  1. Did my OC cause this?
    By myth in forum PC Hardware and Components
    Replies: 19
    Last Post: 05-04-2005, 12:36 PM
  2. A strange error Please help
    By Jambo in forum Help! Quick Relief From Tech Headaches
    Replies: 10
    Last Post: 03-04-2005, 05:09 PM
  3. bsod error
    By MuTTy_Hc in forum Software
    Replies: 3
    Last Post: 26-09-2004, 08:50 PM
  4. 8o!! taste hot WineX powaaah!
    By directhex in forum Software
    Replies: 33
    Last Post: 31-05-2004, 08:18 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •