Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New Coder
    Join Date
    Feb 2007
    Location
    Cairns, Australia
    Posts
    26
    Thanks
    6
    Thanked 0 Times in 0 Posts

    Navigation Collapsing

    I'm having a bit of trouble in IE with my navigation bar at the bottom of a web page i just created. Works ok in FF

    Page is here:
    http://www.villamoderncyprus.com/

    CSS is Here:
    http://www.villamoderncyprus.com/css/styles.css

    You can see (In IE) when you hover over the nav at the bottom of the page it collapses. I can't see what I'm doing wrong.

    Thanks for your help!
    www.dameonjamie.com | MSN Mesenger Handle: dameon@dameonjamie.com | Skype Name: dameon.jamie

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,852
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Validate and fix the errors in your markup first, see http://validator.w3.org/check?uri=ht...Inline&group=0
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    New Coder
    Join Date
    Feb 2007
    Location
    Cairns, Australia
    Posts
    26
    Thanks
    6
    Thanked 0 Times in 0 Posts
    abduraooft said:

    Validate and fix the errors in your markup first...
    Thanks for your reply. Ok I did that:

    Validate

    Problem is still occurring in IE.
    www.dameonjamie.com | MSN Mesenger Handle: dameon@dameonjamie.com | Skype Name: dameon.jamie

  • #4
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,852
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Alright! now try
    Code:
    #Navigation2 {
    	text-align: center;
    	margin-top: 1em;
    	margin-right: 0em;
    	margin-bottom: 2em;
    	margin-left: 0em;
    	padding: 0em;
    }
    #Navigation2 ul {
    	margin: 0px;
    	padding: 0px;
    	border: 1px solid #D4D9F7;
    	background-color: #191F44;
    }
    PS: Here is a bbcode tip for you
    Quote Originally Posted by dameonjamie View Post
    abduraooft said:
    Validate and fix the errors in your markup first...
    I thought that this was of interest.
    Last edited by abduraooft; 04-13-2009 at 11:53 AM.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • Users who have thanked abduraooft for this post:

    dameonjamie (04-13-2009)

  • #5
    New Coder
    Join Date
    Feb 2007
    Location
    Cairns, Australia
    Posts
    26
    Thanks
    6
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by abduraooft
    #Navigation2 {
    text-align: center;
    margin-top: 1em;
    margin-right: 0em;
    margin-bottom: 2em;
    margin-left: 0em;
    padding: 0em;
    }
    #Navigation2 ul {
    margin: 0px;
    padding: 0px;
    border: 1px solid #D4D9F7;
    background-color: #191F44;
    }
    Ok! Thank you!

    That's works in IE and FF.

    I don't understand why...I don't have those properties on
    Navigation1 ul

    Would you let me know why this works and why what I had does not.

    Last edited by dameonjamie; 04-13-2009 at 12:20 PM. Reason: Learning
    www.dameonjamie.com | MSN Mesenger Handle: dameon@dameonjamie.com | Skype Name: dameon.jamie

  • #6
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,852
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Well, that's the collapsible margin peekaboo box model issue ... Lol

    Really don't know the reason, but it came accidentally to my attention that, when I add a border around that #Navigation2 ul (which is my favourite debugging technique), it becomes OK. So, I just moved that border (and background, to keep the look and feel) from the #Navigation2 to this one.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • Users who have thanked abduraooft for this post:

    dameonjamie (04-13-2009)

  • #7
    New Coder
    Join Date
    Feb 2007
    Location
    Cairns, Australia
    Posts
    26
    Thanks
    6
    Thanked 0 Times in 0 Posts
    Thank you abduraooft.
    You are certainly a Master Coder.

    I will use this whenever it is called for.

    btw...I have another site that has this same sort of layout but it never gave me the same problem...if you're curious have a look at:

    http://www.paperpossibilities.com.au/
    www.dameonjamie.com | MSN Mesenger Handle: dameon@dameonjamie.com | Skype Name: dameon.jamie


  •  

    Tags for this Thread

    Posting Permissions

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