[css-d] Drop down menu pushing content down

2013-03-19 Thread Mike

Hi guys,

I hope someone can help with a little problem. A new website I am 
designing looks perfect in Firefox 18 on Linux and in Safari. But it's 
not right in Opera on Linux, Chrome on Windows and probably several 
others. URL - www.integra-server.co.uk/lnp/wb/


I think the problem is the drop-down nav menu on the left. The sub uls 
expand the width of the top level ul to accommodate them and this is 
pushing the main content down.


If anyone can suggest a solution it would be appreciated.

regards,
Mike
--
Integra Web Design
Braehead, Rhynie, AB54 4LS
01464 861535
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Drop down menu pushing content down

2013-03-19 Thread David Postill
On Tue, 19 Mar 2013 12:17:28 +, Mike wrote:

| Hi guys,
| 
| I hope someone can help with a little problem. A new website I am 
| designing looks perfect in Firefox 18 on Linux and in Safari. But it's 
| not right in Opera on Linux, Chrome on Windows and probably several 
| others. URL - www.integra-server.co.uk/lnp/wb/
| 
| I think the problem is the drop-down nav menu on the left. The sub uls 
| expand the width of the top level ul to accommodate them and this is 
| pushing the main content down.
| 
| If anyone can suggest a solution it would be appreciated.

As always - validate :)

http://validator.w3.org/check?verbose=1uri=http%3A%2F%2Fwww.integra-server.co.uk%2Flnp%2Fwb%2F
17 errors

http://jigsaw.w3.org/css-validator/validator?profile=css21warning=0uri=http%3A%2F%2Fwww.integra-server.co.uk%2Flnp%2Fwb%2F
15 errors

Cheers,
-- 
David Postill
Dance your Life - Biodanza in Alkmaar, Holland - http://www.danceyourlife.eu
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Drop down menu pushing content down

2013-03-19 Thread Laura Valentino
On Tue, Mar 19, 2013 at 12:17 PM, Mike m...@integrawebdesign.co.uk wrote:

 Hi guys,

 I hope someone can help with a little problem. A new website I am
 designing looks perfect in Firefox 18 on Linux and in Safari. But it's not
 right in Opera on Linux, Chrome on Windows and probably several others. URL
 - www.integra-server.co.uk/lnp/**wb/
 http://www.integra-server.co.uk/lnp/wb/


On my windows desktop computer it looks ok in Chrome but not in IE 9.

Could it be something to do with how different browsers interpret the box
model? (some count the padding as part of the width and some don't). If
floated content is too wide for the container it gets pushed down.

Someone helped me with this issue on here recently and gave me this code to
put in the css to fix it.

* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box; }

Regards,
Laura
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Drop down menu pushing content down

2013-03-19 Thread Mike

On 19/03/13 13:55, Laura Valentino wrote:

On Tue, Mar 19, 2013 at 12:17 PM, Mike m...@integrawebdesign.co.uk wrote:


Hi guys,

I hope someone can help with a little problem. A new website I am
designing looks perfect in Firefox 18 on Linux and in Safari. But it's not
right in Opera on Linux, Chrome on Windows and probably several others. URL
- www.integra-server.co.uk/lnp/**wb/
http://www.integra-server.co.uk/lnp/wb/



On my windows desktop computer it looks ok in Chrome but not in IE 9.

Could it be something to do with how different browsers interpret the box
model? (some count the padding as part of the width and some don't). If
floated content is too wide for the container it gets pushed down.

Someone helped me with this issue on here recently and gave me this code to
put in the css to fix it.

* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box; }

Regards,
Laura

Thanks, Laura, but it doesn't solve the problem. In fact, it reduces the 
widths of the boxes and makes it look worse.


Mike

--
Integra Web Design
Braehead, Rhynie, AB54 4LS
01464 861535
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Drop down menu pushing content down

2013-03-19 Thread Tom Livingston
On Tue, Mar 19, 2013 at 10:51 AM, Mike m...@integrawebdesign.co.uk wrote:

 On 19/03/13 13:55, Laura Valentino wrote:

 On Tue, Mar 19, 2013 at 12:17 PM, Mike m...@integrawebdesign.co.uk
 wrote:

  Hi guys,

 I hope someone can help with a little problem. A new website I am
 designing looks perfect in Firefox 18 on Linux and in Safari. But it's
 not
 right in Opera on Linux, Chrome on Windows and probably several others.
 URL
 - 
 www.integra-server.co.uk/lnp/wb/http://www.integra-server.co.uk/lnp/**wb/
 http://www.integra-server.co.**uk/lnp/wb/http://www.integra-server.co.uk/lnp/wb/
 



 On my windows desktop computer it looks ok in Chrome but not in IE 9.

 Could it be something to do with how different browsers interpret the box
 model? (some count the padding as part of the width and some don't). If
 floated content is too wide for the container it gets pushed down.

 Someone helped me with this issue on here recently and gave me this code
 to
 put in the css to fix it.

 * {
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 box-sizing: border-box; }

 Regards,
 Laura

  Thanks, Laura, but it doesn't solve the problem. In fact, it reduces the
 widths of the boxes and makes it look worse.


 Mike

 --


Im wondering if it might be a float/width issue, maybe? I was only able to
see the issue in IE9. Does adjusting the width/margins of the nav and/or
#content help?

Also, are you telling the browsers what wrapper/wrapper is and how to
render it?

Just some thoughts...

-- 

Tom Livingston | Senior Interactive Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Drop down menu pushing content down

2013-03-19 Thread Hahnel, Fred (DET-MRM)


-Original Message-
From: css-d-boun...@lists.css-discuss.org 
[mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of Mike
Sent: Tuesday, March 19, 2013 8:17 AM
To: css-d@lists.css-discuss.org
Subject: [css-d] Drop down menu pushing content down

Hi guys,

I hope someone can help with a little problem. A new website I am designing 
looks perfect in Firefox 18 on Linux and in Safari. But it's not right in Opera 
on Linux, Chrome on Windows and probably several others. URL - 
www.integra-server.co.uk/lnp/wb/

I think the problem is the drop-down nav menu on the left. The sub uls expand 
the width of the top level ul to accommodate them and this is pushing the 
main content down.

If anyone can suggest a solution it would be appreciated.

regards,
Mike
--
Integra Web Design
Braehead, Rhynie, AB54 4LS
01464 861535


The content div needs a width.

Try 760px

You can 'play' with this live by using a Developer Tool for the browser



-Fred Hahnel
__
css-discuss [css-d@lists.css-discuss.org] 
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- 
http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
This message contains information which may be confidential and privileged. 
Unless you are the intended recipient (or authorized to receive this message 
for the intended recipient), you may not use, copy, disseminate or disclose to 
anyone the message or any information contained in the message.  If you have 
received the message in error, please advise the sender by reply e-mail, and 
delete the message.  Thank you very much.

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Drop down menu pushing content down

2013-03-19 Thread Mike

On 19/03/13 15:32, Hahnel, Fred (DET-MRM) wrote:



-Original Message-
From: css-d-boun...@lists.css-discuss.org 
[mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of Mike
Sent: Tuesday, March 19, 2013 8:17 AM
To: css-d@lists.css-discuss.org
Subject: [css-d] Drop down menu pushing content down

Hi guys,

I hope someone can help with a little problem. A new website I am designing 
looks perfect in Firefox 18 on Linux and in Safari. But it's not right in Opera 
on Linux, Chrome on Windows and probably several others. URL - 
www.integra-server.co.uk/lnp/wb/

I think the problem is the drop-down nav menu on the left. The sub uls expand the 
width of the top level ul to accommodate them and this is pushing the main content 
down.

If anyone can suggest a solution it would be appreciated.

regards,
Mike
--
Integra Web Design
Braehead, Rhynie, AB54 4LS
01464 861535


The content div needs a width.

Try 760px

You can 'play' with this live by using a Developer Tool for the browser



-Fred Hahnel
__
css-discuss [css-d@lists.css-discuss.org] 
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- 
http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
This message contains information which may be confidential and privileged. 
Unless you are the intended recipient (or authorized to receive this message 
for the intended recipient), you may not use, copy, disseminate or disclose to 
anyone the message or any information contained in the message.  If you have 
received the message in error, please advise the sender by reply e-mail, and 
delete the message.  Thank you very much.


Thanks Fred, that's sorted it, I think. Certainly in Opera and IE8. I 
knew it had to be something simple.


cheers,
Mike

--
Integra Web Design
Braehead, Rhynie, AB54 4LS
01464 861535
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Drop down menu pushing content down

2013-03-19 Thread Eric
Mike,

I took a look at your site in FF 19.0.2 and Chrome 25.0.1364.172 m both on Win7
and they look identical to me. Could be more specific about where the problem
is?
Thanks,
Eric Miner
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/