Re: [WSG] Footer on the very bottom of the viewing port
Ah, that old chestnut ;-) There was a good article in ALA about this recently: http://www.alistapart.com/articles/footers/ HTH. Cheers, Mike On Thursday, April 8, 2004, at 05:01 PM, Mike Kear wrote: I want to have a footer stuck to the bottom of the browser window, but if the window reduces in size, the footer goes over the top of other page content. What I'd like to do is have the footer stick to the bottom of the browser, except if it collides with other page content, which will push it down below the bottom of the viewing port and have a vertical scroll bar appear. Is this possible with CSS? I know it's done with tables, because that's how this site is now, but I want to get rid of these tables. Cheers Mike Kear AFP Webworks, Windsor, NSW, Australia. * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help * * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] I am having a problem... Tab (li) width
Chris,
I can't help directly, but just in case you haven't tried this yet ...
You can alter the styles for the current page throughout your site by
assigning each page body and each li in your navigation list a
unique id, then setting up some descendant selector rules, eg.
HTML:
body id=contact
...
div id=navigation
ul
...
lia id=contactTab href=contact.phpContact/a/li
/ul
...
CSS:
body#home a#homeTab,
...
body#contact a#contactTab { ... }
As a side benefit, you can then include the navigation div into each
page with php and keep your code in the one place, rather than having
several similar but slightly different versions throughout your site.
I can't play around with the browser that's giving you problems because
I'm on a different platform, but if buggy behaviour is involved it
might help to try a different approach.
Cheers,
Mike
On Thursday, April 22, 2004, at 01:23 PM, Chris Stratford wrote:
Hey Peter,
No it didnt work...
I added the code like you said.
But its not the problem.
it only happens with the 5th tab...
even if there are 7 tabs, only the 5th tab is effected...
no matter what content is written in that tab..
its really eating at my sanity.
but yeah.
RE: tab width...
I have styled the a tag to be the tab, not the li
so when i hover it changes appearance...
would making the LI a fixed witdth work?
And also - the LI is display: inline, and I have never seen widths set
to inline elements before...
some things i just dont get!
Chris Stratford
[EMAIL PROTECTED]
Http://www.neester.com
Peter Firminger wrote:
Did my suggestion last night help?
Hey everyone...
this problem is still a problem for me...
anyone have any suggestions??
basically - I want to define the width of the tabs on my website...
withouth havint to add a span...
Try something like this locally if you want to have different values
for
each:
li style=width: 80px;a
href=/something/index.htmSomething/a/li
li style=width: 90px;a
href=/something/index.htmSomething/a/li
li style=width: 1000px;a
href=/something/index.htmSomething/a/li
P
*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
*
.
*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
*
Re: [WSG] Css problems..
Vince, Set the image to display: block or vertical-align: bottom. Details here: http://devedge.netscape.com/viewsource/2002/img-table/ Cheers, Mike On Thursday, June 3, 2004, at 11:00 PM, Befree wrote: Hi, i've a problem with Mozilla that i can't resolve. In this site (www.comune.castelnuovo-berardenga.si.it) Mozilla display a white line under the top banner and i can't understand why. anybody can help me? thanks, bye. Vince * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help * * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] Help with making DIVs behave
Hi Rosie,
The div's not misbehaving, it's the floated image ... but that's how
floats are meant to work.
Clearing the float by adding dl { clear:both; } to your stylesheet will
give you what you want.
Cheers,
Mike
On Tuesday, June 8, 2004, at 11:46 PM, Rosie Norwood wrote:
Hi all,
Sorry for the basic question but I am new to making DIVs behave. I am
converting my old site from tables to DIVs and trying to get a similar
look.
The page troubling me is: http://www.blackwork.com/test/sample.html
The CSS is at: http://www.blackwork.com/test/stitches.css - the rules
relating to the div class site is right at the bottom.
I want the image to fill the div so that the div completely contains it
and the bottom border appears after the image.
*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
*
Re: [WSG] my site works on Mac, not PC :: suggestions???
On Saturday, October 16, 2004, at 03:13 PM, Shane Helm wrote: Any suggestions would be greatly appreciated! If others have solved your float problem Shane, can I suggest that you don't insist that the window resize itself to full-screen? I'm lucky enough to have a large screen (20 Apple Cinema Display, running at 1680 x 1050), like a small but presumably growing proportion of web users, and I just *don't* need to see that much of your repeating background ;-) I do however want to see the windows and applications I've got running behind my browser. To make the behaviour worse, Firefox places the resize tab *below* the window edge and out of reach, which is a pain to say the least. I'm sure you don't want to spoil the impression such a beautiful site makes on your visitors by instructing it to behaviour rudely in their environment. :o) Sorry for posting slightly off-topic, but I believe it's in keeping with the standards spirit of providing an equally enjoyable experience for every user. Cheers, Mike ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Float causing footer text to drop?
Hi Lyn,
It's not the float which is causing the footer to drop, it's this rule:
p { margin-top: 5em;}
Set that to 0 and you'll find the footer text moves right back to where
you want it.
Cheers,
Mike
On Sunday, October 31, 2004, at 07:00 PM, Lyn Patterson wrote:
Have added a floated box to main content area and this seems to have
caused the footer text to drop out of the footer and sit beneath it.
I can't see where to correct this. Have tried to clear it but
obviously not putting it in the right place. Any advice would be
appreciated.
www.mwg.green.net.au/testpages/copycards.html
www.mwg.green.net.au/testpages/copytherest.css
Thanks
Lyn
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
Re: [WSG] Up and down arrows using HTML entities
Hi Jason, If you do want to use an image rather than an entity, you can style it to display inline with a height width of 1em (or something else to your preference). It scales just fine. I haven't checked this across many browsers, but it should be widely supported. Cheers, Mike On Monday, November 8, 2004, at 03:56 PM, Steve Winter wrote: Jason, I can't offer any suggestion, but I can advise that on XP SP 2, in both FireFox 0.8 and IE 6.0 uarr; and darr; both render fine, and seem to scale okay too... Cheers Steve -Original Message- From: Jason Anderson [EMAIL PROTECTED] To: [EMAIL PROTECTED] Date: Mon, 8 Nov 2004 15:42:56 +1100 Subject: [WSG] Up and down arrows using HTML entities Hi, I'm setting up a table which will can be sorted by clicking on one of the headers, and I'd like to display the sort order (ascending or descending) by drawing a little arrow next to the column name. I thought about using an image, but of course it wouldn't scale with the text. Is there a good technique for drawing a text arrow in most browsers, which degrades nicely if it can't be displayed? I found a page which shows some HTML entity codes, including the arrows, at http://www.htmlhelp.com/reference/html40/entities/symbols.html I tried uarr; and darr; and they work great in Safari 1.2.1 and Firefox 0.9.1, but the page says browser support for those entities is generally very poor. I don't have a PC nearby to test with, and I have no idea what a screen reader would do. Am I out of luck? Thanks, -- Jason Anderson http://www.thenewjhp.com ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Proper IE Hacks
Wayne, It *is* confusing. But, yes, a separate stylesheet, loaded via conditional comments is the most future proof method. Not exactly what Phillipe is describing, but along the same lines. Perhaps this will help get you going: http://phonophunk.phreakin.com/news/?p=46 Cheers, Mike ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Say no to CSS hacks with branching techniques
James, I can see where you're coming from, and I'm all for the programming purity you're advocating, but I want to stick my hand up in support of Thierry's position here. In fact, I was in the process of assembling all these filters myself when he posted his link to this list, so I'm grateful to him for saving me the extra work ;-) [...] is http://lists.w3.org/Archives/Public/www-style/2005Apr/0027.html The last comment on CCs there shows the conflict of hack usage most clearly: Their use encourages the practice of coding for specific browsers, which goes against the whole purpose of standardisation! CSS hacks do too, but they don't pollute the document markup and they're more acceptable if used in moderation and when absolutely necessary to maintain accessibility. CSS hacks are pollution too, even in a style sheet. (And conditional comment usage for styling purposes need never be anything other than 'moderate'). Even the best hack - star html, let's say - is worse than a CC imho, because sure, it's valid, but it's not the least bit standard, and locating these hacks in the same place as standard rules only blurs the distinction between the two. CC's not only let me _isolate_ all the hacks from my standard style rules, they also let anyone else on the team (including novice coders) debug display problems *using only standard code* in a separate file. No-one needs to learn or implement anything other than CSS standards so, in a sense, you could say that conditional comments help teach good CSS. And the only 'semantic' content that's been changed in the (X)HTML is a reference to a file ... which is neither meaningful, nor part of the document content, or it wouldn't be in the head. I just don't see the downside (Andrew's mention of the extra few lines of code notwithstanding ... the hacks aren't made of helium, after all ;-) One of the functions of this list and group is to implement best practices using W3C standards based development. These conditionals you talk about are a Microsoft addition to workaround bugs in their software (what happened to fixing the bugs?), like coloured scrollbars and DirectX calls in CSS instead of correct PNG alpha support. The bugs will never be fixed, the conditional comment support to work around them will never change. It's as good as we ever get in this game. Feel free to use your conditional comments, I'm not going to stop you, but don't pass it off as good programming. Well, I am trying to pass it off as just that. Feel free to argue the point further if I you remain unconvinced. Check out the HTML 4 spec on comments : http://www.w3.org/TR/html401/intro/sgmltut.html#idx-HTML for more info. And check out the results of following only w3c specs in the browser most people still (inexplicably) use :-) It's just not professionally acceptable to deliver that to clients, as you well know. And I think CSS filters, as Thierry has listed them, while certainly outside the letter of the specs (and proper programming practice), are quite in keeping with their spirit. Cheers, Mike ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] How to resolve z-index problem for select box in IE 6
HI Brajesh, It's not exactly a z-index problem, although it's similar. Google iframe shim and you'll find many variations of the same answer. HTH, Mike On 28/01/2010, at 6:02 PM, Brajesh Patel wrote: Hello All, I am getting Z-index problem in IE 6. back ground select box are displaying on the popup when popup appear, it's working fine on the firefox but getting problem in IE 6, Please suggest solution this is major issue for me. Thanks in advance. -- Brajesh Patel *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] HTML5/CSS3 form input to web page
Hi Nick,
That's not really a standards-related question ... nonetheless, here's sample
code which will do what you want :-)
Feel free to remove the $(document).ready wrapper if you're including it at the
end of your DOM as shown. Adjust it for your library of choice if you prefer
something other than jQuery.
Cheers,
Mike
!DOCTYPE html
html lang=en
head
meta charset=utf-8
titleMirror script/title
/head
body
form
input type=text name=userInput value= id=userInput
/form
div id=mirrorInput/div
script
src=https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js;/script
script
$(document).ready(function () {
$('#userInput').keyup(function () {
$('#mirrorInput').html($(this).val());
});
});
/script
/body
/html
On 24/09/2011, at 1:48 AM, 8bits Media wrote:
Hi,
I'm trying to find a way of displaying dynamic text (via a text input field)
on a web page.
Basically, when a user inputs text it needs to render (in real time) in an
adjacent space on the same page. The adjacent space is a flyer that can then
be printed by the user with the text they typed in.
Does anyone know of an existing HTML5/CSS3 script that will do this?
Thanks,
Nick.
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
