Re: [WSG] 100% height over existing page
Hmm... not really an option here. It needs to have the potential to appear on any page, so that if someone finds an internal page through Google or gets a link sent to them by a friend, they still see the disclaimer / warning. At the moment I've sort of solved the problem for users with JS - if the disclaimer is showing, I set the body's overflow to hidden so you can't scroll. It still means that non-JS users get that ugly cut-off, though. I'll live with it if I have to, but would certainly prefer not to have to. :) Cheers, Seona. 2008/7/31 Adam Martin [EMAIL PROTECTED]: The easiest way would be to have an entry page instead. On Thu, Jul 31, 2008 at 2:56 PM, Seona Bellamy [EMAIL PROTECTED] wrote: I've had no trouble making the div that sits on top of everything extend to the height of the viewport, but if the page extends beyond that then you see normal (and clickable) page as soon as you scroll. Don't want that, if possible. Does anyone have any idea of the most reasonable way to do this? I want to try and give the full experience to as many as possible. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] IE loses background image
On Thu, Jul 31, 2008 at 1:50 AM, Michael Horowitz
[EMAIL PROTECTED] wrote:
My background image is disappearing in IE 7 but shows up in Firefox, Opera
and safari. It's at horowitzfamily.net
I'm thinking I have a conflict between different background images
I have verified I have valid css
http://jigsaw.w3.org/css-validator/validator?profile=css21warning=0uri=http%3A%2F%2Fwww.horowitzfamily.net%2F
#mainNav ul a {
margin:0;
padding:0;
display:block;
line-height:40px;
text-decoration:none;
color:#00;
background:url(../images/button3.jpg)no-repeat;
font-size: 10px;
color:#4d4325;
font-weight:bold;
text-indent:35px;
}
#mainNav img {
margin:0px;
padding:0px;
display:block;
float: left;
}
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
background-image:url(../images/background.jpg);
font-size:10px;
}
--
Michael Horowitz
Your Computer Consultant
http://yourcomputerconsultant.com
561-394-9079
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Add a space on the background property, like this:
background:url(../images/button3.jpg) no-repeat;
Gonzalo
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] 100% height over existing page
Depending on what/whether you're using anything server side, just set a session variable that records whether the person has agreed to the terms, do this across every page and no worries for Google or any other entry that doesn't come from the front page. regards Luke Seona Bellamy wrote: Hmm... not really an option here. It needs to have the potential to appear on any page, so that if someone finds an internal page through Google or gets a link sent to them by a friend, they still see the disclaimer / warning. At the moment I've sort of solved the problem for users with JS - if the disclaimer is showing, I set the body's overflow to hidden so you can't scroll. It still means that non-JS users get that ugly cut-off, though. I'll live with it if I have to, but would certainly prefer not to have to. :) Cheers, Seona. 2008/7/31 Adam Martin [EMAIL PROTECTED]: The easiest way would be to have an entry page instead. On Thu, Jul 31, 2008 at 2:56 PM, Seona Bellamy [EMAIL PROTECTED] wrote: I've had no trouble making the div that sits on top of everything extend to the height of the viewport, but if the page extends beyond that then you see normal (and clickable) page as soon as you scroll. Don't want that, if possible. Does anyone have any idea of the most reasonable way to do this? I want to try and give the full experience to as many as possible. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] 100% height over existing page
What, and divert them to the agreement page if they'rve not agreed? Hmm... not sure that I'll get the go-ahead to do that. We're working to some fairly tight design requirements. I've already got it saving the session variable once they agree, so that they only get bothered once. Cheers, Seona. 2008/7/31 Luke Hoggett [EMAIL PROTECTED]: Depending on what/whether you're using anything server side, just set a session variable that records whether the person has agreed to the terms, do this across every page and no worries for Google or any other entry that doesn't come from the front page. regards Luke *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] 100% height over existing page
Doesn't have to be a separate divert page, you can just use the session variable to decided whether the overlay element is displayed on each page regards Luke Seona Bellamy wrote: What, and divert them to the agreement page if they'rve not agreed? Hmm... not sure that I'll get the go-ahead to do that. We're working to some fairly tight design requirements. I've already got it saving the session variable once they agree, so that they only get bothered once. Cheers, Seona. 2008/7/31 Luke Hoggett [EMAIL PROTECTED]: Depending on what/whether you're using anything server side, just set a session variable that records whether the person has agreed to the terms, do this across every page and no worries for Google or any other entry that doesn't come from the front page. regards Luke *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] 100% height over existing page
That's already what I'm doing. Not the problem here, though. The issue isn't whether the overlay and disclaimer appear - I have that bit working just fine. The issue is making the overlay extend all the way to the bottom of the page if the page is longer than the viewport. Cheers, Seona. 2008/7/31 Luke Hoggett [EMAIL PROTECTED]: Doesn't have to be a separate divert page, you can just use the session variable to decided whether the overlay element is displayed on each page regards Luke Seona Bellamy wrote: What, and divert them to the agreement page if they'rve not agreed? Hmm... not sure that I'll get the go-ahead to do that. We're working to some fairly tight design requirements. I've already got it saving the session variable once they agree, so that they only get bothered once. Cheers, Seona. 2008/7/31 Luke Hoggett [EMAIL PROTECTED]: Depending on what/whether you're using anything server side, just set a session variable that records whether the person has agreed to the terms, do this across every page and no worries for Google or any other entry that doesn't come from the front page. regards Luke *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] 100% height over existing page
Hmm, What about just making it the size of the viewport, and stopping scrolling? Maybe an overflow: hidden on the body? Cheers, Tony -Original Message- From: Seona Bellamy [EMAIL PROTECTED] Date: Thu, 31 Jul 2008 16:48:48 To: wsg@webstandardsgroup.org Subject: Re: [WSG] 100% height over existing page That's already what I'm doing. Not the problem here, though. The issue isn't whether the overlay and disclaimer appear - I have that bit working just fine. The issue is making the overlay extend all the way to the bottom of the page if the page is longer than the viewport. Cheers, Seona. 2008/7/31 Luke Hoggett [EMAIL PROTECTED]: Doesn't have to be a separate divert page, you can just use the session variable to decided whether the overlay element is displayed on each page regards Luke Seona Bellamy wrote: What, and divert them to the agreement page if they'rve not agreed? Hmm... not sure that I'll get the go-ahead to do that. We're working to some fairly tight design requirements. I've already got it saving the session variable once they agree, so that they only get bothered once. Cheers, Seona. 2008/7/31 Luke Hoggett [EMAIL PROTECTED]: Depending on what/whether you're using anything server side, just set a session variable that records whether the person has agreed to the terms, do this across every page and no worries for Google or any other entry that doesn't come from the front page. regards Luke *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] IE loses background image
just add layout to a
it's usuall cause of bg'disapearing
2008/7/31 Gonzalo González Mora [EMAIL PROTECTED]
On Thu, Jul 31, 2008 at 1:50 AM, Michael Horowitz
[EMAIL PROTECTED] wrote:
My background image is disappearing in IE 7 but shows up in Firefox, Opera
and safari. It's at horowitzfamily.net
I'm thinking I have a conflict between different background images
I have verified I have valid css
http://jigsaw.w3.org/css-validator/validator?profile=css21warning=0uri=http%3A%2F%2Fwww.horowitzfamily.net%2F
#mainNav ul a {
margin:0;
padding:0;
display:block;
line-height:40px;
text-decoration:none;
color:#00;
background:url(../images/button3.jpg)no-repeat;
font-size: 10px;
color:#4d4325;
font-weight:bold;
text-indent:35px;
}
#mainNav img {
margin:0px;
padding:0px;
display:block;
float: left;
}
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
background-image:url(../images/background.jpg);
font-size:10px;
}
--
Michael Horowitz
Your Computer Consultant
http://yourcomputerconsultant.com
561-394-9079
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Add a space on the background property, like this:
background:url(../images/button3.jpg) no-repeat;
Gonzalo
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] 100% height over existing page
no JS - no decision ;) 2008/7/31 Tony McNulty [EMAIL PROTECTED] Hmm, What about just making it the size of the viewport, and stopping scrolling? Maybe an overflow: hidden on the body? Cheers, Tony -Original Message- From: Seona Bellamy [EMAIL PROTECTED] Date: Thu, 31 Jul 2008 16:48:48 To: wsg@webstandardsgroup.org Subject: Re: [WSG] 100% height over existing page That's already what I'm doing. Not the problem here, though. The issue isn't whether the overlay and disclaimer appear - I have that bit working just fine. The issue is making the overlay extend all the way to the bottom of the page if the page is longer than the viewport. Cheers, Seona. 2008/7/31 Luke Hoggett [EMAIL PROTECTED]: Doesn't have to be a separate divert page, you can just use the session variable to decided whether the overlay element is displayed on each page regards Luke Seona Bellamy wrote: What, and divert them to the agreement page if they'rve not agreed? Hmm... not sure that I'll get the go-ahead to do that. We're working to some fairly tight design requirements. I've already got it saving the session variable once they agree, so that they only get bothered once. Cheers, Seona. 2008/7/31 Luke Hoggett [EMAIL PROTECTED]: Depending on what/whether you're using anything server side, just set a session variable that records whether the person has agreed to the terms, do this across every page and no worries for Google or any other entry that doesn't come from the front page. regards Luke *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] 100% height over existing page
But that doesn't stop you from adding more css in the markup for this feature, to override the default styles. -Original Message- From: [EMAIL PROTECTED] Date: Thu, 31 Jul 2008 11:09:30 To: wsg@webstandardsgroup.org Subject: Re: [WSG] 100% height over existing page no JS - no decision ;) 2008/7/31 Tony McNulty [EMAIL PROTECTED] Hmm, What about just making it the size of the viewport, and stopping scrolling? Maybe an overflow: hidden on the body? Cheers, Tony -Original Message- From: Seona Bellamy [EMAIL PROTECTED] Date: Thu, 31 Jul 2008 16:48:48 To: wsg@webstandardsgroup.org Subject: Re: [WSG] 100% height over existing page That's already what I'm doing. Not the problem here, though. The issue isn't whether the overlay and disclaimer appear - I have that bit working just fine. The issue is making the overlay extend all the way to the bottom of the page if the page is longer than the viewport. Cheers, Seona. 2008/7/31 Luke Hoggett [EMAIL PROTECTED]: Doesn't have to be a separate divert page, you can just use the session variable to decided whether the overlay element is displayed on each page regards Luke Seona Bellamy wrote: What, and divert them to the agreement page if they'rve not agreed? Hmm... not sure that I'll get the go-ahead to do that. We're working to some fairly tight design requirements. I've already got it saving the session variable once they agree, so that they only get bothered once. Cheers, Seona. 2008/7/31 Luke Hoggett [EMAIL PROTECTED]: Depending on what/whether you're using anything server side, just set a session variable that records whether the person has agreed to the terms, do this across every page and no worries for Google or any other entry that doesn't come from the front page. regards Luke *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] 100% height over existing page
True. I'm already doing that via JS, so at least the majority of people will not see an ugly cut-off with the page showing normally beneath it. It would be nicer to have a non-JS solution, though. I mean, even though scrolling down and clicking a link in the footer won't help them bypass the security (since the session variable won't be set, they'll just get the same message on the new page) it's still messy and inelegant. 2008/7/31 Сергей Кириченко [EMAIL PROTECTED]: no JS - no decision ;) 2008/7/31 Tony McNulty [EMAIL PROTECTED] Hmm, What about just making it the size of the viewport, and stopping scrolling? Maybe an overflow: hidden on the body? Cheers, Tony -Original Message- From: Seona Bellamy [EMAIL PROTECTED] Date: Thu, 31 Jul 2008 16:48:48 To: wsg@webstandardsgroup.org Subject: Re: [WSG] 100% height over existing page That's already what I'm doing. Not the problem here, though. The issue isn't whether the overlay and disclaimer appear - I have that bit working just fine. The issue is making the overlay extend all the way to the bottom of the page if the page is longer than the viewport. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] 100% height over existing page
You know, that's a very good point... putting it inside the if-block so that it only runs on pages where the message is showing. Tony, you're a legend. :) Thanks. 2008/7/31 Tony McNulty [EMAIL PROTECTED]: But that doesn't stop you from adding more css in the markup for this feature, to override the default styles. From: [EMAIL PROTECTED] Date: Thu, 31 Jul 2008 11:09:30 +0400 To: wsg@webstandardsgroup.org Subject: Re: [WSG] 100% height over existing page no JS - no decision ;) 2008/7/31 Tony McNulty [EMAIL PROTECTED] Hmm, What about just making it the size of the viewport, and stopping scrolling? Maybe an overflow: hidden on the body? Cheers, Tony -Original Message- From: Seona Bellamy [EMAIL PROTECTED] Date: Thu, 31 Jul 2008 16:48:48 To: wsg@webstandardsgroup.org Subject: Re: [WSG] 100% height over existing page That's already what I'm doing. Not the problem here, though. The issue isn't whether the overlay and disclaimer appear - I have that bit working just fine. The issue is making the overlay extend all the way to the bottom of the page if the page is longer than the viewport. Cheers, Seona. 2008/7/31 Luke Hoggett [EMAIL PROTECTED]: Doesn't have to be a separate divert page, you can just use the session variable to decided whether the overlay element is displayed on each page regards Luke Seona Bellamy wrote: What, and divert them to the agreement page if they'rve not agreed? Hmm... not sure that I'll get the go-ahead to do that. We're working to some fairly tight design requirements. I've already got it saving the session variable once they agree, so that they only get bothered once. Cheers, Seona. 2008/7/31 Luke Hoggett [EMAIL PROTECTED]: Depending on what/whether you're using anything server side, just set a session variable that records whether the person has agreed to the terms, do this across every page and no worries for Google or any other entry that doesn't come from the front page. regards Luke *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] 100% height over existing page
exactly, I realise now that this was implicit in my reply, rather than explicit. I bow to Tony as a better communicator than I. regards Luke Seona Bellamy wrote: You know, that's a very good point... putting it inside the if-block so that it only runs on pages where the message is showing. Tony, you're a legend. :) Thanks. 2008/7/31 Tony McNulty [EMAIL PROTECTED]: But that doesn't stop you from adding more css in the markup for this feature, to override the default styles. From: [EMAIL PROTECTED] Date: Thu, 31 Jul 2008 11:09:30 +0400 To: wsg@webstandardsgroup.org Subject: Re: [WSG] 100% height over existing page no JS - no decision ;) 2008/7/31 Tony McNulty [EMAIL PROTECTED] Hmm, What about just making it the size of the viewport, and stopping scrolling? Maybe an overflow: hidden on the body? Cheers, Tony -Original Message- From: Seona Bellamy [EMAIL PROTECTED] Date: Thu, 31 Jul 2008 16:48:48 To: wsg@webstandardsgroup.org Subject: Re: [WSG] 100% height over existing page That's already what I'm doing. Not the problem here, though. The issue isn't whether the overlay and disclaimer appear - I have that bit working just fine. The issue is making the overlay extend all the way to the bottom of the page if the page is longer than the viewport. Cheers, Seona. 2008/7/31 Luke Hoggett [EMAIL PROTECTED]: Doesn't have to be a separate divert page, you can just use the session variable to decided whether the overlay element is displayed on each page regards Luke Seona Bellamy wrote: What, and divert them to the agreement page if they'rve not agreed? Hmm... not sure that I'll get the go-ahead to do that. We're working to some fairly tight design requirements. I've already got it saving the session variable once they agree, so that they only get bothered once. Cheers, Seona. 2008/7/31 Luke Hoggett [EMAIL PROTECTED]: Depending on what/whether you're using anything server side, just set a session variable that records whether the person has agreed to the terms, do this across every page and no worries for Google or any other entry that doesn't come from the front page. regards Luke *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] IE loses background image
That does it. Shame it doesn't fail validation for such a problem.
Michael Horowitz
Your Computer Consultant
http://yourcomputerconsultant.com
561-394-9079
Gonzalo González Mora wrote:
On Thu, Jul 31, 2008 at 1:50 AM, Michael Horowitz
[EMAIL PROTECTED]
mailto:[EMAIL PROTECTED] wrote:
My background image is disappearing in IE 7 but shows up in
Firefox, Opera and safari. It's at horowitzfamily.net
http://horowitzfamily.net
I'm thinking I have a conflict between different background images
I have verified I have valid css
http://jigsaw.w3.org/css-validator/validator?profile=css21warning=0uri=http%3A%2F%2Fwww.horowitzfamily.net%2F
http://jigsaw.w3.org/css-validator/validator?profile=css21warning=0uri=http%3A%2F%2Fwww.horowitzfamily.net%2F
#mainNav ul a {
margin:0;
padding:0;
display:block;
line-height:40px;
text-decoration:none;
color:#00;
background:url(../images/button3.jpg)no-repeat;
font-size: 10px;
color:#4d4325;
font-weight:bold;
text-indent:35px;
}
#mainNav img {
margin:0px;
padding:0px;
display:block;
float: left;
}
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
background-image:url(../images/background.jpg);
font-size:10px;
}
--
Michael Horowitz
Your Computer Consultant
http://yourcomputerconsultant.com
561-394-9079
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
mailto:[EMAIL PROTECTED]
***
Add a space on the background property, like this:
background:url(../images/button3.jpg) no-repeat;
Gonzalo
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
RE: [WSG] Advice on design
Hi,
Thanks to everyone for the help with the design of the site. As always very
helpful suggestions and ideas.
Thanks,
Elaine
http://www.webdandy.co.uk
-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
Behalf Of Martin Heiden
Sent: 25 July 2008 11:18
To: Web Dandy Design
Subject: Re: [WSG] Advice on design
Elaine,
on Friday, July 25, 2008 at 11:42 wsg@webstandardsgroup.org wrote:
I'm looking for some advice on the best way to put together the navigation
for the following design:
http://www.webdandy.co.uk/navigation-slice.jpg, so
that it's standards compliant and accessible (and if at all possible
avoids
using images for the text under the nav buttons).
I'd use an unordered list with background images for the graphics and
normal text. For this, you must slice the navigation. The decorative
part of the image may remain one single slice.
Problem: Text-Sizing.
If the user increases the text size, the layout will break.
It may be possible to avoid this by absolute positioning with em
sizing:
ul id=navigation
li id=homea href=home.htmlspanHome/span/a/li
[...]
/ul
ul#navigation li {
float:left;
}
ul#navigation li a {
display: block;
height: 100%;
width: 100%;
}
li#home {
position: relative;
width: n px;
height: m px;
}
li#home a span {
position: absolute;
top: y em;
left: n/2 px;
width: z em;
margin-left: -z/2 em;
}
I didn't test this, but it may be a starting point.
regards
Martin
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] form from hell - difficult redesign
There is a recent article in alistapart about tabular data. The author is also a WSG contributor, who might point you in the direction of some good research. her site: http://formulate.com.au Joe On Jul 31, 2008, at 02:09, kevin mcmonagle wrote: Hi I've been asked to redesign the gui on a hotel booking engine / room allocation web app. Its basically the busiest example of tabular data ive ever seen - most data in the cells is input. Any Advice on styling an overwhelming amount tabular data? -best kevin *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** == Joe Ortenzi [EMAIL PROTECTED] http://www.typingthevoid.com http://twitter.com/wheelyweb *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] Accessible Form Buttons
Hi WSG List! I'm working on a contracted project at the moment and the team is in a debate about how to make the website buttons scalable and yet still accessible. Also we want to use a minimal amount of markup. Obviously we cant use CSS background images as they wont scale. At the moment we have used CSS to layer an anchor over an img that does scale. The issue with this is now if people have no CSS support, the anchor and img will then be next to each other and then button wont be clickable. Does anyone know of another solution to this problem? Any assistance will be greatly appreciated! Regards, Darren Lovelock Munkyonline.co.uk *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Accessible Form Buttons
I'm working on a contracted project at the moment and the team is in a debate about how to make the website buttons scalable and yet still accessible. Also we want to use a minimal amount of markup. Obviously we cant use CSS background images as they wont scale. At the moment we have used CSS to layer an anchor over an img that does scale. The issue with this is now if people have no CSS support, the anchor and img will then be next to each other and then button wont be clickable. Does anyone know of another solution to this problem? Any assistance will be greatly appreciated! Using extra markup: http://tjkdesign.com/lab/uploader/buttons.asp -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Accessible Form Buttons
You have a few choices: 1. Use input type=submit and scale the input using ems. Advantages Will scale in most browsers works in all mobile browsers works with CSS disabled works with images disabled works with javascript disabled Disadvantages: Does not scale in Safari or Camino Can only use images as a background image which you can't scale easily 2. Use button type=submit, use a scaling image and scale the image and button using ems. Advantages Will scale in all browsers that support the button element works with CSS disabled works with images disabled (if you use decent alt text) works with javascript disabled Disadvantages: Button is not supported by some mobile browsers and Netscape 4 3: Use a link around scaling image Will scale in all browsers works with CSS disabled works with images disabled (if you use decent alt text) Disadvantages: will not work with javascript disabled (needed for form submit If you want to see the examples of the button element have a look at a presentation I gave 2.5 years ago, it also show the limitations of the input element. http://nickcowie.com/presentation/s5-button.html Nick Cowie http://nickcowie.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Accessible Form Buttons
Quoting Thierry Koblentz [EMAIL PROTECTED]: I'm working on a contracted project at the moment and the team is in a debate about how to make the website buttons scalable and yet still accessible. Also we want to use a minimal amount of markup. Obviously we cant use CSS background images as they wont scale. At the moment we have used CSS to layer an anchor over an img that does scale. The issue with this is now if people have no CSS support, the anchor and img will then be next to each other and then button wont be clickable. Does anyone know of another solution to this problem? Any assistance will be greatly appreciated! Using extra markup: http://tjkdesign.com/lab/uploader/buttons.asp -- Regards, Thierry | http://www.TJKDesign.com Thanks Thierry, looks good and works well. I'm not sure the other team members will like the markup though! *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] How to move text near but not on the bottom of a div
I have a menu list of items at horowitzfamily.net. In Dreamweaver they
line up near the bottom of my header div but in browsers IE, Firefox,
Opera and Safari they end up on the top.
I thought I might us line-height to move them (as that worked on my side
menu list but got inconsistent results accross browsers. Any
suggestions on how to best choose a location of a menu like this
#header{
margin:0px;
padding:0px;
width: 100%;
height: 73px;
background-image:url(../images/header4.jpg);
}
#header img{
float: left;
}
#header ul li{
float:right;
font-size:10px;
/*line-height: 14px;*/
margin:0px;
padding:0px;
}
#header ul a {
text-decoration:none;
color:#4d4325;
}
Thanks
--
Michael Horowitz
Your Computer Consultant
http://yourcomputerconsultant.com
561-394-9079
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
RE: [WSG] How to move text near but not on the bottom of a div
Hi Michael,
Try this,
#header{
margin:0px;
padding:0px;
width: 100%;
height: 73px;
background-image:url(../images/header4.jpg);
}
#header img{
float: left;
}
#header ul li{
float:right;
font-size:10px;
}
#header ul li a {
text-decoration:none;
color:#4d4325;
line-height: 14px;
margin:0px;
padding:0px;
}
-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
Behalf Of Michael Horowitz
Sent: 31 July 2008 16:50
To: wsg@webstandardsgroup.org
Subject: [WSG] How to move text near but not on the bottom of a div
I have a menu list of items at horowitzfamily.net. In Dreamweaver they
line up near the bottom of my header div but in browsers IE, Firefox,
Opera and Safari they end up on the top.
I thought I might us line-height to move them (as that worked on my side
menu list but got inconsistent results accross browsers. Any
suggestions on how to best choose a location of a menu like this
#header{
margin:0px;
padding:0px;
width: 100%;
height: 73px;
background-image:url(../images/header4.jpg);
}
#header img{
float: left;
}
#header ul li{
float:right;
font-size:10px;
/*line-height: 14px;*/
margin:0px;
padding:0px;
}
#header ul a {
text-decoration:none;
color:#4d4325;
}
Thanks
--
Michael Horowitz
Your Computer Consultant
http://yourcomputerconsultant.com
561-394-9079
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
--
No virus found in this incoming message.
Checked by AVG.
Version: 7.5.524 / Virus Database: 270.5.7/1580 - Release Date: 29/07/2008
17:26
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] How to move text near but not on the bottom of a div
Didn't work.
What properties do people think I should play with. What I want to
learn to go beyond this one issue is how do I best control text
placement for menu lists that use background images.
Michael Horowitz
Your Computer Consultant
http://yourcomputerconsultant.com
561-394-9079
Essential eBiz Solutions Ltd wrote:
Hi Michael,
Try this,
#header{
margin:0px;
padding:0px;
width: 100%;
height: 73px;
background-image:url(../images/header4.jpg);
}
#header img{
float: left;
}
#header ul li{
float:right;
font-size:10px;
}
#header ul li a {
text-decoration:none;
color:#4d4325;
line-height: 14px;
margin:0px;
padding:0px;
}
-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
Behalf Of Michael Horowitz
Sent: 31 July 2008 16:50
To: wsg@webstandardsgroup.org
Subject: [WSG] How to move text near but not on the bottom of a div
I have a menu list of items at horowitzfamily.net. In Dreamweaver they
line up near the bottom of my header div but in browsers IE, Firefox,
Opera and Safari they end up on the top.
I thought I might us line-height to move them (as that worked on my side
menu list but got inconsistent results accross browsers. Any
suggestions on how to best choose a location of a menu like this
#header{
margin:0px;
padding:0px;
width: 100%;
height: 73px;
background-image:url(../images/header4.jpg);
}
#header img{
float: left;
}
#header ul li{
float:right;
font-size:10px;
/*line-height: 14px;*/
margin:0px;
padding:0px;
}
#header ul a {
text-decoration:none;
color:#4d4325;
}
Thanks
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] How to move text near but not on the bottom of a div
Just to show I just am not asking questions. I found what seems to be a
good answer
#header ul {
position: relative;
top: 55px;
right: 30px;
}
This position relative seems to be a good way to move text around. I'd
love to know what people think of this.
Michael Horowitz
Your Computer Consultant
http://yourcomputerconsultant.com
561-394-9079
Michael Horowitz wrote:
Didn't work.
What properties do people think I should play with. What I want to
learn to go beyond this one issue is how do I best control text
placement for menu lists that use background images.
Michael Horowitz
Your Computer Consultant
http://yourcomputerconsultant.com
561-394-9079
Essential eBiz Solutions Ltd wrote:
Hi Michael,
Try this,
#header{
margin:0px;
padding:0px;
width: 100%;
height: 73px;
background-image:url(../images/header4.jpg);
}
#header img{
float: left;
}
#header ul li{
float:right;
font-size:10px;
}
#header ul li a {
text-decoration:none;
color:#4d4325;
line-height: 14px;
margin:0px;
padding:0px;
}
-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On
Behalf Of Michael Horowitz
Sent: 31 July 2008 16:50
To: wsg@webstandardsgroup.org
Subject: [WSG] How to move text near but not on the bottom of a div
I have a menu list of items at horowitzfamily.net. In Dreamweaver
they line up near the bottom of my header div but in browsers IE,
Firefox, Opera and Safari they end up on the top.
I thought I might us line-height to move them (as that worked on my
side menu list but got inconsistent results accross browsers. Any
suggestions on how to best choose a location of a menu like this
#header{
margin:0px;
padding:0px;
width: 100%;
height: 73px;
background-image:url(../images/header4.jpg);
}
#header img{
float: left;
}
#header ul li{
float:right;
font-size:10px;
/*line-height: 14px;*/
margin:0px;
padding:0px;
}
#header ul a {
text-decoration:none;
color:#4d4325;
}
Thanks
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] 100% height over existing page
*grin* Than thanks to you as well, Luke, and sorry I was missing your point. :) Cheers, Seona. 2008/7/31 Luke Hoggett [EMAIL PROTECTED]: exactly, I realise now that this was implicit in my reply, rather than explicit. I bow to Tony as a better communicator than I. regards Luke Seona Bellamy wrote: You know, that's a very good point... putting it inside the if-block so that it only runs on pages where the message is showing. Tony, you're a legend. :) Thanks. 2008/7/31 Tony McNulty [EMAIL PROTECTED]: But that doesn't stop you from adding more css in the markup for this feature, to override the default styles. From: [EMAIL PROTECTED] Date: Thu, 31 Jul 2008 11:09:30 +0400 To: wsg@webstandardsgroup.org Subject: Re: [WSG] 100% height over existing page no JS - no decision ;) 2008/7/31 Tony McNulty [EMAIL PROTECTED] Hmm, What about just making it the size of the viewport, and stopping scrolling? Maybe an overflow: hidden on the body? Cheers, Tony -Original Message- From: Seona Bellamy [EMAIL PROTECTED] Date: Thu, 31 Jul 2008 16:48:48 To: wsg@webstandardsgroup.org Subject: Re: [WSG] 100% height over existing page That's already what I'm doing. Not the problem here, though. The issue isn't whether the overlay and disclaimer appear - I have that bit working just fine. The issue is making the overlay extend all the way to the bottom of the page if the page is longer than the viewport. Cheers, Seona. 2008/7/31 Luke Hoggett [EMAIL PROTECTED]: Doesn't have to be a separate divert page, you can just use the session variable to decided whether the overlay element is displayed on each page regards Luke Seona Bellamy wrote: What, and divert them to the agreement page if they'rve not agreed? Hmm... not sure that I'll get the go-ahead to do that. We're working to some fairly tight design requirements. I've already got it saving the session variable once they agree, so that they only get bothered once. Cheers, Seona. 2008/7/31 Luke Hoggett [EMAIL PROTECTED]: Depending on what/whether you're using anything server side, just set a session variable that records whether the person has agreed to the terms, do this across every page and no worries for Google or any other entry that doesn't come from the front page. regards Luke *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] Re: WSG Digest
I am out of the office until August 4th and will not be able to access email regularly until my return. If this is urgent, please call me at 617 515 7579. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
