5 replies [Last post]
wundurra
Offline
newbie
Brisbane, Australia
Last seen: 13 years 5 weeks ago
Brisbane, Australia
Timezone: GMT+10
Joined: 2007-04-09
Posts: 9
Points: 0

I've got a problem with my left navigation div.
It disappears in IE7, but still appears in Firefox top style pro.

I have validated the main page of my site, but the problem is still there. I've tried for a day to get it right but I don't know where to look any more... If anyone has some ideas I'd be great full to get rid of this problem.

URL: http://www.akdingo.com/
HTML Code:

www.akdingo.com

Logo - <a href=www.dingo.com">

ent_wrapper">

Home Page
Dingo Breed Description
My Online Journal
My Gallery
Places I've Been
Contact Me

April 2, 2007: This website is Under Construction.

Thankyou for visiting my website. Unfortunatly I have not had the time to add all my content to the site.

Please check back soon as I will be adding more to the site every couple of days.

Webmaster
akdingo.com

Merry Christmas, and Happy New Year

a The last year has gone by so quickly its a case of 'Blink and you'll miss it'. I didnt get the chance to send out christmas cards this year so I would like to wish you all a great new year.

Lets hope 2007 will see alot of changes for the better.

This website is still being constructed...

I hav ebeen working hard on the website, trying to get the colours and layout right. It can be very trying at times. I'm happy with the colours and layout now so the next thing to do is put the content up.

I will have my online journal up and running by the end of the week, and the weekend will see some photos available too.

The Australian Dingo...

A few years ago I began 'Dingo' as a nickname while chatting on the internet. As soon as I used it, I was confronted with questions about the dingo and I was amazed at how little I really knew about dingoes, so I decided to take the time to find out.

To cut a long story short I have spent a few months over the last few years volunteering at a New South Wales Dingo Sanctuary . and I will continue to support the pure dingo and the efforts to preserve them.

Right now I am working fulltime and have had to put my work with dingoes on the back burners, though I still have a strong desire to help conserve the dingo.

This website is one way I can continue to support dingo conservation, and hopefully this will lead to a closer involvement in dingo conservation projects.

Valid HTML 4.01 Transitional Valid CSS!

CSS Code:
/*************************************************/
/* HTML Set-up */
/*************************************************/
html, body {
background-color: #405339;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
height: 100%;
}

h1, h2, h3, h4, h5, h6 {
font-family: Arial,sans-serif;
margin: 0px;
padding: 0px;
}

h1, h2 {
font-family: Verdana,Arial,sans-serif;
font-size: 120%;
color: #334d55;
}

h3, h5 { font-size: 100%; color: #334d55; }

h4{ font-size: 100%; font-weight: normal; color: #333333; }

/*************************************************/
/* Navigation format */
/*************************************************/

#top{
background-image: url(res/hr.gif);
background-repeat: repeat-x;
background-position: bottom;
background-color: #637C5E;
border-bottom: 1px solid Black;
height: 103px;
margin-bottom: 4px;
}

#leftnav{
left: 2px;
float: left;
position: absolute;
width: 180px; /*height: 100%;*/
font-size: 80%;
}

.LNmenu{ margin-top: 0px; margin-bottom: 4px; }

.LNmenu a{
border: 1px solid Black;
text-decoration: none;
width: 100%;
}

.LNmenu a.mainitem{
display: block;
font-size: 100%;
color: #EEEBDF;
background-color: #6A674A;
margin: 0px 0px 0px 0px;
padding: 3px 0px 3px 5px;
width: 180px;
font-style: italic;
}

.LNmenu a.mainitem:hover {
color: White;
background-color: #7E7857;
text-decoration: none;
}

.LNmenu a.subitem{
display: block;
font-size: 84%;
color: Black;
background-color: #979375;
margin: 1px 0px 2px 3px;
padding: 2px 5px 3px 10px;
width: 167px;
}

/*************************************************/
/* Content format */
/*************************************************/
.content{
float: left;
width: auto;
margin: 0px 3px 10px 200px;
padding: 5px 10px 8px 10px;
background: #FEFEFE;
border: 1px solid Black;
text-align: justify;
}

.content h1{ clear: left; border-bottom: 1px solid Black; }

.content h2{
clear: left;
border-bottom: 1px solid Black;
margin-top: 17px;
}

.content p { margin: 10px 10px 10px 0px; }

.floatleft{ margin: 0px 12px 0px 0px; float: left; clear: left; }

.floatright{ margin: 12px 0px -3px 12px; float: right; clear: right; }

/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-*/
/*Blog Styles start here */
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-*/
/* Blog Posts */
.bPosts {
float: left;
width: auto;
margin: 0px 3px 10px 193px;
padding: 5px 10px 8px 10px;
text-align: justify;
}

.odd, .even{
padding: 5px 5px 5px 5px;
margin: 0px 0px 5px 0px;
border: 1px solid Black;
border-top: none;
text-align: justify;
}

.odd { background-color: #fff; color: inherit; }

.even{ background-color: #ddd; color: inherit; }

/* Side Bar Contents */
.bSideBar { }

.bSideItem {
margin: 2ex;
padding: 0 0 2ex 0;
border-bottom: 1px solid #ddd;
}

.bSideItem ul {
margin-left: 8px;
padding-left: 8px;
margin-top: 8px;
margin-bottom: 8px;
list-style-type: square;
}

.bSideItem ul ul{
margin-left: 8px;
padding-left: 8px;
margin-top: 0px;
margin-bottom: 0px;
}

JTitcomb
Offline
Regular
Last seen: 13 years 34 weeks ago
Timezone: GMT-5
Joined: 2007-01-23
Posts: 13
Points: 0

absolute float

I haven't tried to reconstruct your page with the code you provided. But one thing strikes me right away:

#leftnav{ left: 2px; float: left; position: absolute; width: 180px; /*height: 100%;*/ font-size: 80%; }

It doesn't really make much sense to use absolute position on a floating element. If you're going to use absolute positioning you should specify a position for the element (i.e. top: 0; left: 0;). Otherwise, if you intend to float the element with respect to the other content on the page, lose the absolute positioning.

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 47 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

As JTitcomb says

As JTitcomb says position:absolute or float which is it? you can't state both, 'absolute' will override the float.

Also you shouldn't place anything before the DTD declaration unless its server side script, you're causing IE6 problems

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

wundurra
Offline
newbie
Brisbane, Australia
Last seen: 13 years 5 weeks ago
Brisbane, Australia
Timezone: GMT+10
Joined: 2007-04-09
Posts: 9
Points: 0

JTitcomb and Hugo, thanks so

JTitcomb and Hugo, thanks so much for your imput, it was those two things that were causing the errors. I had started off with absolute positioning without the float so I'm kicking myself for not noticing that.

and the DTD problem Hugo mentioned was part of my php scripting... one php file for header, top div and left-nav which selects which sub-menu to display, and one php for the content of the page, which added that comment tag at the top before including the header.

Lesson's learnt. thanks guys

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 37 weeks 1 day ago
Joined: 2004-06-30
Posts: 9668
Points: 801

Did you fix it all?

Did you fix it all?

Verschwindende wrote:
  • CSS doesn't make pies

wundurra
Offline
newbie
Brisbane, Australia
Last seen: 13 years 5 weeks ago
Brisbane, Australia
Timezone: GMT+10
Joined: 2007-04-09
Posts: 9
Points: 0

yes thanks I did fix what

yes thanks I did fix what was broken, I consider this solved. thanks.