[css-d] columns streching
so i'am looking for a place with good explaination of the technique(s) of: columns streching to the bottom of the viewport, regardless of the content length of any of the columns through google i found in some forums tips for specific user questions, but not a good article that (thorrow) explains (if there are several solutions, pros cons, etc.) how you should tackle this goal something ALA (or comparable) like please some links / tips thanks, Erik __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Lock down some text sizes
Tim Ware wrote: [...] we *definitely* need to lock down the file size for the navigation or it breaks the design. [...] Hi Tim, After all (not working/accessible solutions: fixed fonts, images, imagemaps with tables and spacers, no site, etc.): Back To Question. ;-) Are you 100% sure the font size must be fixed in the navigation (-bar, I suppose)? Maybe there is a workaround which enables a scalable font-size, and doesn't break the design. To see if there is such an alternative/escape, a page with the design is needed. Do you have a link to a testpage which we can see? francky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] @import media rule
jack fredricks wrote: I have tried; 1) imported print.css for all media 2) wrapped the content of print.css in an @media print rule but it still doesnt work for silly IE6 FF is fine. FF web dev toolbar shows that print.css was linked properly. Just a tip - Wrapping this way allows u change the @media print rule to @media all, effectively allowing you to see what your page will print like (as ofc is print preview). I guess that means my question is; Is there a way to import a print only style sheet for IE without using a LINK element? I don't think so, as a parsing bug in IE/win - which seems to be present in all Trident-based versions, included IE7, will make that browser look for another file when '@import ... print' is used. I use that parsing bug as a hack[1] - replacing 'conditional comments', but I still have to rely on the @media rule in the stylesheet to prevent it from being a 'media all' stylesheet. Now, all my testing shows that IE6 picks up _my_ printing-styles correctly the way I have applied the @import and @media rules - although IE/win can be quite stubborn when it comes to overriding some of the dedicated screen styles with the equivalent print styles. Do you have a link so I can look a bit closer at the problem you are experiencing? regards Georg [1]http://www.gunlaug.no/contents/wd_additions_12.html -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Firefox 1.03 and floats
Hi, Am having a problem with floats on Firefox ( PC - Ver 1.03). Basic enough page, with a right floated element followed by some text, problem was/is the text ended up being pushed out to the right and ended up half off-screen. I thought I had fixed this issue as it first manifested itself on Firefox on the PC and Safari/Firefox on the Mac, I fixed it then by simply putting in a clearing div after a float right div. This straightened it all out and everything worked well on all browsers I checked in (PC - IE, Firefox, Opera. MAC - Safari, Firefox). Then this morning a user with PC firefox 1.03 found the exact same problem. Is there some known issue with that version of Firefox and how it works with floats and clears etc? Thanks. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Accomodation gallery in IE
Erik Gyepes wrote:
As we all know IE is very very buggy browser, just look to this page:
http://www.pripisa.sk/stranka/ubytovanie/ in FF, then in IE?
How to solve this unlikely mess?
Hi Erik,
As you can see, IE6 is 'helping'(!!) you by making sure that it expands
the container and causing the problem that you're experiencing!! :)
Here is *one* answer (although I must admit, I'm not a big fan of it as
it seems a bit 'hack-y'):
1. Add an extra span around the text within the link, eg.
a href=[LINK] title=[TITLE] class=ubytimg alt=Penzión Zelený
dom - Rajecké Teplice src=[IMG] border=2spanPenzión Zelený dom -
Rajecké Teplice/span/a
(by the way, you need to get rid of the border attribute - set it in
your stylesheet! :)
2. Add the following to your stylesheet:
.top-vyrobok a {
position:relative;
}
.top-vyrobok a span {
position:absolute;
top:110px;
left:0;
width:100%;
}
Just tested it in IE6, FF1.5.0.3, Safari2.0.3, Opera8.54, Mac
Opera9.00(b3216) and all looks OK.
I HATE adding extra markup though, so if someone has a better solution,
I'd love to hear it!!
cheers,
Stuart
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Giving Focus
I have two small forms on a page. I am giving focus to a form element,
but I only want to effect one of the forms. Can anyone assist?
The code: input:focus, input.sffocus {
background: #8197B7;
}
This snipet of code is attached to a javaScript
Page is located at:
http://www3.esu.edu/beta/aboutesu/welcome_ctr/directions/directions.htm
Steve LaBadie, Web Manager
East Stroudsburg University
200 Prospect St.
East Stroudsburg, Pa 18301-2999
570-422-3999
[EMAIL PROTECTED] mailto:[EMAIL PROTECTED]
http://www.esu.edu http://www.esu.edu/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] columns streching
Erik Visser wrote: so i'am looking for a place with good explaination of the technique(s) of: columns streching to the bottom of the viewport, regardless of the content length of any of the columns through google i found in some forums tips for specific user questions, but not a good article that (thorrow) explains (if there are several solutions, pros cons, etc.) how you should tackle this goal something ALA (or comparable) like please some links / tips thanks, Erik Hi Erik, I think these are the best explanations i've found: http://www.alistapart.com/articles/holygrail/ This outlines a good 3 column layout and the associated pros and cons as well as a description of how to create full length columns. Its a pity but browser support can vary, I think its Opera 8 has some problems. This is my preferred method and uses a graphic to create a false column, unfortunately it needs to be fixed width (although that can sometimes be a good thing): http://www.alistapart.com/articles/fauxcolumns/ Hope this helps, Rob __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] One fieldset shifting place in IE/Win
Seona Bellamy wrote: Just noticed a problem with our sign-up form. When you look at it in IE/Win (don't know if it happens on Mac too or not) the fieldset Company Details is sitting against the left edge of the content space instead of pushed out from it like all the others are. I've gone over both markup and CSS and I can't for the life of me find anything that could be causing this. The boss uses IE, so he's noticed it and is pushing me to get it fixed. Can someone please have a look and suggest why this is happening? I'm at a complete loss. Page: http://www.renovate.com.au/classified/index.cfm?page=registerproduct=0D24E196-4854-53E3-EAA9C1C39A4F26AD CSS: http://www.renovate.com.au/_resources/css/classified.css Hi Seona, I'm not 100% sure why this happening (although it *IS* IE, after all!:) but you can fix the issue by applying the 10px left-margin to the form rather than the fieldsets (I have only tested this in IE6 and FF though!) cheers, - Stuart __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] PNG alpha transparency bug in Firefox
Hi,
I'm not actually sure what's the problem but here is the description,
maybe someone knows what's going on. I tried to make a better example
page but couldn't replicate the bug so I must present the whole web page.
http://www.pulu.org/transbug/ministri.php?j=weltsu
SEURAAVAT KEIKAT in the left column has a PNG alpha-channel
background-image. The newest Opera and Firefox support that so I use:
html[xmlns] .keikkalistaContainer {background-image:
url('../layout_images/pieni.png');} /* not for IE */
For IE I use:
!--[if gte IE 5.5000]style type=text/css/* IE \*/ * html
.keikkalistaContainer
{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader
(src='layout_images/pieni.png',sizingMethod='scale');} /* IE */
/style![endif]--
It worked fine as far as I noticed the strange behaviour in Firefox
(1.5.0.3). Leave the URL I gave in background for a few minutes and the
background-image has disappeared (well it doesn't always do that...)
Scroll up and down and it has appeared back. Opera works well, so does
IE (but it uses different codes). I'm not sure but it seems like the bug
is only in that specific page, not in
http://www.pulu.org/transbug/index.php for example.
Another issue is the profile background (middle part, blue bordered)
place in IE6 (not in 5.5 for example), it's aligned to left for some
reason. Also the profile texts get lost after a while (the page must be
in background) and can be get back by painting with mouse or scrolling
down the page.
Thanks for help,
Lassi Heikkinen
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] columns streching
the wiki has a good list of sites to visit: http://css-discuss.incutio.com/?page=AnyColumnLongest if you don't mind some javascript, here's another link i have bookmarked: http://www.ampsoft.net/webdesign-l/making-web-pages-extend-to-bottom.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Possible to overriding embedded SS with external SS?
I'm pretty sure this is bass-ackwards, but I need to be able to over-ride an embedded stylesheet with an external one, if the external one exists. I was thinking it might be possible to do using javascript something like this... The embedded stylesheet would be included in the js code. On page load, the script checks to see if the external stylesheet exists and then either writes it or the included one to the page's head. Anybody have any experience with / thoughts about the viability of this approach? Happy to explain more about the problem / constraints if desired. Thanks in advance, Bill __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] PNG alpha transparency bug in Firefox
Lassi Heikkinen wrote: http://www.pulu.org/transbug/ministri.php?j=weltsu SEURAAVAT KEIKAT in the left column has a PNG alpha-channel background-image. ... It worked fine as far as I noticed the strange behaviour in Firefox (1.5.0.3). Leave the URL I gave in background for a few minutes and the background-image has disappeared (well it doesn't always do that...) Scroll up and down and it has appeared back. Confirmed. I stared a few minutes at the Fx1.5.0.3 screen both in Mac and in PC, nothing happened: the page kept being dark, with grim looking young men remaining grim looking young men. Then I opened IE7 to check the page, and after closing IE, the png has vanished in Fx. Ingo -- http://www.satzansatz.de/css.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Possible to overriding embedded SS with external SS?
I'm pretty sure this is bass-ackwards, but I need to be able to over-ride an embedded stylesheet with an external one, if the external one exists. I was thinking it might be possible to do using javascript something like this... The embedded stylesheet would be included in the js code. On page load, the script checks to see if the external stylesheet exists and then either writes it or the included one to the page's head. Anybody have any experience with / thoughts about the viability of this approach? Happy to explain more about the problem / constraints if desired. Not in CSS, so that is off-topic. However, I don't see it as a big problem. On the server side try to fetch the stylesheet and if the result is zilch just write out the local one. You could even do it in AJAX, but that is a bit pointless as you need a server side component anyways (as AJAX cannot reach files outside the same domain). -- Chris Heilmann Blog: http://www.wait-till-i.com Writing: http://icant.co.uk/ Binaries: http://www.onlinetools.org/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Firefox 1.03 and floats
Then this morning a user with PC firefox 1.03 found the exact same problem. Is there some known issue with that version of Firefox and how it works with floats and clears etc? Eoin, very had for me to answer without the code. Show it. Niklas __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Possible to overriding embedded SS with external SS?
I'm pretty sure this is bass-ackwards, but I need to be able to over-ride an embedded stylesheet with an external one, if the external one exists. I was thinking it might be possible to do using javascript something like this... it is off-topic, but I am also on the php list so may as well answer this here. You could check whether the external stylesheet exists, and if so do a str_replace on the content between the style elements. Pretty simple - if you know php. -- http://www.web-buddha.co.uk dynamic web programming from Reigate, Surrey UK (php, mysql, xhtml, css) look out for project karma, our new venture, coming soon! __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Problems with IE doing centered layout
I am trying to use css to do the layout on http://www.centralmiss.com/accesscontrolgroup/index.html and most everything seems correct in firefox, but IE is not creating the box I desire at all. CSS can be found at http://www.centralmiss.com/accesscontrolgroup/style.css.txt Any help is greatly appreciated. Jay Drake __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Possible to overriding embedded SS with external SS?
Christian Heilmann wrote: Not in CSS, so that is off-topic. I was trying to figure out how to get the 'right CSS' applied to the doc. I see now that including the 'how' part put me off topic. My bad. My apologies. Best regards, Bill __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problems with IE doing centered layout
I'm not sure if IE will allow you to set a width on the body element. It's best to just make a container div to create that fixed width box, and I would think that would fix the problem. -Jade Rauenzahn On 5/17/06, Deprived One [EMAIL PROTECTED] wrote: I am trying to use css to do the layout on http://www.centralmiss.com/accesscontrolgroup/index.html and most everything seems correct in firefox, but IE is not creating the box I desire at all. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problems with IE doing centered layout
I am trying to use css to do the layout on http://www.centralmiss.com/accesscontrolgroup/index.html and most everything seems correct in firefox, but IE is not creating the box I desire at all. Agreed - use a container div with a fixed width. Also, try and keep your css file naming convention to ***.css rather than ***.txt - makes it easier for people to identify it in the future. -- http://www.web-buddha.co.uk dynamic web programming from Reigate, Surrey UK (php, mysql, xhtml, css) look out for project karma, our new venture, coming soon! __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problems with IE doing centered layout
Thank you for the input. Changing it up to use a containing div seems to have taken care of the problem. Now to go poke around at the other little issues. Jay Jade Rauenzahn wrote: I'm not sure if IE will allow you to set a width on the body element. It's best to just make a container div to create that fixed width box, and I would think that would fix the problem. -Jade Rauenzahn On 5/17/06, Deprived One [EMAIL PROTECTED] wrote: I am trying to use css to do the layout on http://www.centralmiss.com/accesscontrolgroup/index.html and most everything seems correct in firefox, but IE is not creating the box I desire at all. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] OK, what am I missing?
On 17/05/06, Dave Pierce [EMAIL PROTECTED] wrote: This is too weird! I finished one page, and it looked great in all of my browsers, plus at the library with IE/Win. Cool. So I changed the text, changed the pictures, and set up three more pages with exactly the same CSS. I've checked the to rogue pages with the good one line-for-line and dot for dot. But the text in http://lorettosedgwick.org/pages/aboutus.html and http://lorettosedgwick.org/pages/sedgwicklife.html is cut off on the left about 2 or 3 letters. During the last couple of days, on aboutus.html, I've tried padding, margins, and even an extra div to see if it would help, but to no avail. I've left those changes on that page for all to see. The original good page was http://lorettosedgwick.org/pages/programs_svcs.html . Anyone have any ideas as to what I'm missing? I wish I was a faster learner, but three weeks of study has just left me knowing how little I know! ...have you tried adding a left margin to .altext p? -- http://www.web-buddha.co.uk dynamic web programming from Reigate, Surrey UK (php, mysql, xhtml, css) look out for project karma, our new venture, coming soon! __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] OK, what am I missing?
On 17/05/06, Dave Pierce [EMAIL PROTECTED] wrote: This is too weird! I finished one page, and it looked great in all of my browsers, plus at the library with IE/Win. Cool. So I changed the text, changed the pictures, and set up three more pages with exactly the same CSS. I've checked the to rogue pages with the good one line-for-line and dot for dot. But the text in http://lorettosedgwick.org/pages/aboutus.html and http://lorettosedgwick.org/pages/sedgwicklife.html is cut off on the left about 2 or 3 letters. During the last couple of days, on aboutus.html, I've tried padding, margins, and even an extra div to see if it would help, but to no avail. I've left those changes on that page for all to see. The original good page was http://lorettosedgwick.org/pages/programs_svcs.html . Anyone have any ideas as to what I'm missing? I wish I was a faster learner, but three weeks of study has just left me knowing how little I know! ...also, not sure if it makes any difference, but there is no terminating ; on the .altext p rule -- http://www.web-buddha.co.uk dynamic web programming from Reigate, Surrey UK (php, mysql, xhtml, css) look out for project karma, our new venture, coming soon! __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problems with IE doing centered layout
Deprived One wrote:
I am trying to use css to do the layout on
http://www.centralmiss.com/accesscontrolgroup/index.html and most
everything seems correct in firefox, but IE is not creating the box I
desire at all. CSS can be found at
http://www.centralmiss.com/accesscontrolgroup/style.css.txt
Any help is greatly appreciated.
Jay Drake
Jay, it is not exactly clear to me about exactly what you are after. If
your goal is to make it the same in IE6.0. FF1.5.2, and Opera9beta, then:
1/ Delete the stuff above the doctype, that is putting it in quirks mode.
2/ div.content { padding-top: 1px; add this to this selector
}
3/ Validate the CSS.
4/ Make a back-up copy of your html file. Run it through
TidyOnlinehttp://infohound.net/tidy/ to clean up the markup.
5/ Validate the markup.
Lucky strike extras:
6/ Trim the page width so it will not draw a scroll bar at 800.
7/ Set the text and side nav flush left(text-aligh: left;
8/ Reset the fonts so that IE can scale them. This one method of doing so:
body { font: 100%/1.2 sans-serif;}
Delete the font-families you currently have on the selectors;
Set the both navs to font-size: 95%;
Set no font-size on the content-text(it will inherit default from the body)
HTH,
~davidLaakso
--
http://www.dlaakso.com/gustave/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Different troubles in different browsers
Not quite sure where to start. Testing in IE and Mozilla and each browser works great in some ways and has issues in others. site: http://www.centralmiss.com/accesscontrolgroup/index.html css: http://www.centralmiss.com/accesscontrolgroup/style.css The only problem I am having with IE is in the header section of the page. For some reason it doesn't want to put the logo image flush against the left edge and it also does not want to put the tagline image to the right of the logo. Instead it drops it down below the logo. In Firefox I have the problem of my leftnav and rightcontent not remaining within the bounds of their containing div. Thank you all again in advance, Jay __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] OK, what am I missing?
Dave Pierce wrote:
... But the text in
http://lorettosedgwick.org/pages/aboutus.html and
http://lorettosedgwick.org/pages/sedgwicklife.html is cut off on the
left about 2 or 3 letters ...
font-size: small ... If only MS had constructed some nasty bugs around
too small font settings.
The bug you are experiencing is unrelated to this. The wrapper for all
that paragraphs that are creeping [1] to the left has a padding-bottom
and a margin-left set.
.friends {
...
padding-bottom: 6px;
border-left: 1em solid #ffeab8;
...
}
The fix is to avoid this combo or to add haslayout [2].
Ingo
[1] http://positioniseverything.net/explorer/creep.html
[2] http://www.satzansatz.de/cssd/onhavinglayout.html
--
http://www.satzansatz.de/css.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] OK, what am I missing?
Ingo Chao wrote: The wrapper for all that paragraphs that are creeping [1] to the left has a padding-bottom and a margin-left set. I meant padding-bottom and border-left ... puzzling. Ingo -- http://www.satzansatz.de/css.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] CSS 4 print
Can I use CSS to move things around on the printed page, including before a page break? -- Marc Luzietti Flagship Project Bayview Financial, L.P. (305) 341-5624 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] OK, what am I missing?
Dave Pierce wrote:
http://lorettosedgwick.org/pages/aboutus.html
Anyone have any ideas as to what I'm missing?
The IE-bug Ingo mentioned.
The easiest way to avoid that bug, is to restyle like this...
.friends {
background: #ffeab8;
padding-top: 3px;
padding-bottom: 6px;
}
.friends p {
background: #ffeab8;
margin: 1em 4px 1em 1em;
}
...and it isn't a good idea to use borders as pseudo-margins anyway,
since borders may end up *black* if border-color is forced by a
browser-option. IE/win is good at that :-)
Also, the 'margin-doubling on floats' bug in IE is messing up the
positions on a couple of other elements.
Adding...
#main{display: inline;}
#content2 {display: inline;}
...will make things render more identical across browser-land.
And while you're at it: avoid using pixels on 'line-height'.
.alttext {line-height: 14px;}
...should be changed to...
.alttext {line-height: 1.1;}
...to avoid overlapping text-lines in IE/win and Opera.
I wish I was a faster learner, but three weeks of study has just left
me knowing how little I know!
Funny, I'm often saying the same... ;-)
regards
Georg
--
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS 4 print
On 5/17/06, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote: Can I use CSS to move things around on the printed page, including before a page break? The short answer is: you definitely can use CSS to do this, but browsers will always mess up your positioning. Basically the only safe CSS-P for printing is: position:static; float:none; As in, the default. From the wiki (http://css-discuss.incutio.com/?page=PrintStylesheets) : --- (Authored by Kevin Venkiteswaran) Part of browsers' poor support for printing includes butchering content that is laid out with anything but position: static. This includes simple positioning such as relative and absolute. For example, Win/IE5.0 and Win/IE5.5 would show only the top-most onscreen portion of a div that was positioned absolute and had overflow: auto (a CSS setup to emulate HTML frames). Similarly, Mozilla 1.6 had similar problems. The solution was to change all position properties from fixed, absolute, etc. back to static. --- The problem I've seen with floats is that floated images will get cut off and even dissappear. If you just float text it *might* work, but you'll have to test and see. Check the wiki page for more info : http://css-discuss.incutio.com/?page=PrintStylesheets -- -- Christian Montoya christianmontoya.com ... rdpdesign.com ... cssliquid.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Position menu to new location
Hi all, I have a division element with an id of menu. It contains an unordered list and a search box. It is contained within no other elements beyond the body tag. Currently, it is the second element in the page, both in code and display. I would like to make it the second to last element in code (before the div#footer element), but keep it in its current display position. Currently, this element has a margin style of 0 auto to facilitate centring. Any thoughts? Thanks. -- Mr. Kim Siever http://www.hotpepper.ca/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Accomodation gallery in IE
Hi Stuart!
Yes that really works. Yeah it is extra code but it works and now this
is the main thing.
Thank very much for your time to help me and testing, you are a good boy :)
Thanks,
Erik
Stuart Homfray wrote:
Erik Gyepes wrote:
As we all know IE is very very buggy browser, just look to this page:
http://www.pripisa.sk/stranka/ubytovanie/ in FF, then in IE?
How to solve this unlikely mess?
Hi Erik,
As you can see, IE6 is 'helping'(!!) you by making sure that it expands
the container and causing the problem that you're experiencing!! :)
Here is *one* answer (although I must admit, I'm not a big fan of it as
it seems a bit 'hack-y'):
1. Add an extra span around the text within the link, eg.
a href=[LINK] title=[TITLE] class=ubytimg alt=Penzión Zelený
dom - Rajecké Teplice src=[IMG] border=2spanPenzión Zelený dom -
Rajecké Teplice/span/a
(by the way, you need to get rid of the border attribute - set it in
your stylesheet! :)
2. Add the following to your stylesheet:
.top-vyrobok a {
position:relative;
}
.top-vyrobok a span {
position:absolute;
top:110px;
left:0;
width:100%;
}
Just tested it in IE6, FF1.5.0.3, Safari2.0.3, Opera8.54, Mac
Opera9.00(b3216) and all looks OK.
I HATE adding extra markup though, so if someone has a better solution,
I'd love to hear it!!
cheers,
Stuart
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Accomodation gallery in IE
Ahoj Tomasz,
ano Polsko, nasi severny susedia :D
No, our companies CMS don't uses Smarty as the templating system. But I
really don't need to use PHP, Stuart send me another type of solution,
so now it is working fine in IE too, just with CSS solution.
Erik
Tomasz Staniak wrote:
Witaj Erik ;)
Witam Tomasz :)
Ah, Slovak - hello there, neighbour ;)
Maybe this helps, but this gallery is generated in PHP, so I must to
write some script to it, I hope I can implement it if there isn't any
other solution.
If it's using Smarty template engine, the code could look like:
{section name=section-name loop=$images}
...some code...
{if ($smarty.section.section-name.iteration is odd/even)}
hr class=clear /
{/if}
{/section}
AFAIR
As for the PHP alone, there are multiple solutions for this.
There are other non-programming solutions, but the ones I know aren't
reliable enough
- maybe others here have some better ideas.
Well, I may be wrong, but you could also try to add overflow: hidden;
to every row container. Or, add clear: both; to it. But I see, that
you don't have a container for each row.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Still probs with n7 csws2 xhtml 1.0
Hi folks, I still have a problem with a page on: http://athene.riv.csu.edu.au/~wmccle01/resources/01index.html Its xhtml css2 and was w3c css validating, but now comes up with 3 parse errors: Line: 85 Context : #container Invalid number : background-image url is not a background-image value : url Line: 85 Context : #container Parse Error - url[images/container.gif] 0 0 repeat-x; Line: 91 Parse Error - :0 auto; top: 23px; position: relative; text-align: left; padding-top: 5px;} #container:after (I'm still pretty shaky on css2) Page now: a. displays uneven left right column heights, b. in ie6 it loses the space between the container (for my left, centre right columns) and the footer c. in n7 it shifts my top menu over to the left by 7px and puts an extra 7px between my top menu and the container (should be 7px only but n7 shows 14px) I need the code to display in N6+ IE5+ I tried the big padding +/- thing before Any help greatly appreciated __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Different troubles in different browsers
Deprived One wrote:
Not quite sure where to start.
Same here.
It's hard to hit a moving target. I think you'll need to clear the
floats to start:
Add this CSS:
br.both { clear: both; }
Add br class=both / to the html as below:
p
To be the finest security and access vendor with the best reputation for
customer satisfaction in our marketing area; the company that stands
apart from the competition and fosters mutually beneficial and long term
partnering relationships with its customers.
/p
/div
/div
br class=both /
/div
/body
/html
Testing in IE and Mozilla and each
browser works great in some ways and has issues in others.
site: http://www.centralmiss.com/accesscontrolgroup/index.html
css: http://www.centralmiss.com/accesscontrolgroup/style.css
The only problem I am having with IE is in the header section of the
page. For some reason it doesn't want to put the logo image flush
against the left edge and it also does not want to put the tagline image
to the right of the logo. Instead it drops it down below the logo.
In Firefox I have the problem of my leftnav and rightcontent not
remaining within the bounds of their containing div.
Jay
Best,
~davidLaakso
--
http://www.dlaakso.com/gustave/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Arbitrary footer trouble.
Hi all, I've been having an intermittent problem with our new CSS/XHTML design -- so intermittent that I haven't been able to reproduce it myself and have only come across it on one occasion when it happened to somebody else and I just happened to be nearby. Sounds real promising, I know. Anyway, as the design is still on an internal test server, I've put the source, CSS, and a fake of what the problem looks like on one of our public servers. If nobody looks at them and has an aha moment, I'll beg IT to make the server temporarily available off-campus and send the problem again. Here's the fake screenshot: http://www1.kenyon.edu/examples/oops_bar.jpg As you probably guessed, that purple bar should be at the bottom of the window, directly beneath and snug up to the yellow bar, not floating around in the middle. This doesn't happen consistently across pages and it doesn't always happen more than once to the same page. Refreshing appears to make it go away. I've only seen it happen in IE 6, but I'm not certain which browser the others who have seen it were using. Here's the source : http://www1.kenyon.edu/examples/oops_source.txt And here's the css: http://www1.kenyon.edu/examples/styles.css Again, don't fool away too much time looking at this if it's not a duh problem. I'm just hoping that someone will know what it is right off the bat :) Thanks, ~RM __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Different troubles in different browsers
Thank you so much David, that was exactly what I needed!
Jay
David Laakso wrote:
Deprived One wrote:
Not quite sure where to start.
Same here.
It's hard to hit a moving target. I think you'll need to clear the
floats to start:
Add this CSS:
br.both { clear: both; }
Add br class=both / to the html as below:
p
To be the finest security and access vendor with the best reputation for
customer satisfaction in our marketing area; the company that stands
apart from the competition and fosters mutually beneficial and long term
partnering relationships with its customers.
/p
/div
/div
br class=both /
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Arbitrary footer trouble.
this probably isn't the ah ha moment answer, but i'm guessing that something is putting your footer at the bottom of the viewport instead of the bottom of the content from the position of the purple bar. i'm guessing your browser window was probably in the 1024x768 range judging by how far down the footer is. again, i doubt this is the best lead, but perhaps i'll get lucky and guess right. :) best of luck! __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] testing a :print style
I've just begun trying to use a seperate style sheet for printed output and I wonder... Are there significant differences between the result of CSS styles for one printer vs. another (as there are in from one browser vs. another)? Is there a reliable way, short of hardcopy, to see what a :print version of a document will look like? Is print preview reliable? Thanks! Bill __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Images in liquid / elastic layouts.
I'm trying my hand at an elastic layout. Where the page expands according to the font size set. I know that static size graphic images are probably not a good idea but designers do use them. As an example: http://www.nicktoye.co.uk/ I englarged the text and noticed the text going out of the box. In my design: http://www.pamshop.com/Template1/exp9.html I thought I could get the graphics to expand (Latin text box) using a rounded corners method. However the box breaks up as the text is enlarged. So being aware of the various limitations and knowing the chances one takes are there some guidelines to follow when using images in a liquid design? Hope this makes sense Mark __ your personal webtop. @ http://www.goowy.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Images in liquid / elastic layouts.
On 5/17/06, Mark Fellowes [EMAIL PROTECTED] wrote: So being aware of the various limitations and knowing the chances one takes are there some guidelines to follow when using images in a liquid design? From http://www.cssliquid.com/resources/ : Experiments with Wide Images: http://www.clagnut.com/sandbox/imagetest/ Liquid Image: http://www.michelf.com/weblog/2005/liquid-image/ There's also some sites in the gallery that have done some cool tricks with images. Hope it helps. -- -- Christian Montoya christianmontoya.com ... rdpdesign.com ... cssliquid.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] CSS onclick event?
Here's an odd one...and this is purely for theoretical purposes. I was just wondering if there was any possible way to have a link remain one color until another one is clicked upon, using *only* CSS. For example, if you had a UL list comprised of 5 links, would it be possible to hover over Link1, have the background color change, and when you clicked on it, it would *remain* the background color...until you clicked on Link 2? (Then Link 1 would revert back to the normal state, while Link 2 remained the hover color?) Does this make sense? Maybe if I put it in the context of a tabbed menu - where whatever section you were on, the tab corresponding to it would pop out - all without switching pages or using a script. I was just wondering if it was too weird an idea...just not possible. ~Shelly __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS onclick event?
On 5/17/06, Design Groups [EMAIL PROTECTED] wrote:
Here's an odd one...and this is purely for theoretical purposes.
I was just wondering if there was any possible way to have a link remain
one color until another one is clicked upon, using *only* CSS.
a:active { color:whatever; }
--
--
Christian Montoya
christianmontoya.com ... rdpdesign.com ... cssliquid.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS onclick event?
Christian Montoya wrote:
a:active { color:whatever; }
Yes, but that only works when you click the button (or mouse down).
When you unclick and move away, the color doesn't remain behind, it
reverts to the visited color. What I'm looking for is the active
state to stay, until another link is clicked.
~Shelly
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS onclick event?
i think your best bet is javascript. javascript could change the css class of the tab and won't change it again until something else is clicked, in which case you take the active class away from the original one and apply it to the newly activated one. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS onclick event?
On 5/17/06, Design Groups [EMAIL PROTECTED] wrote:
Christian Montoya wrote:
a:active { color:whatever; }
Yes, but that only works when you click the button (or mouse down).
When you unclick and move away, the color doesn't remain behind, it
reverts to the visited color. What I'm looking for is the active
state to stay, until another link is clicked.
~Shelly
___
I usually use a class (.active{background-color:pink; color:red;} for example)
and then if I am on page X then give this link the .active class. We
use a middle-ware for this (ColdFusion, usually), but I am sure JS can
be used. Or hard code the pages for this.
HTH
--
Tom Livingston
Senior Multimedia Artist
Media Logic
www.mlinc.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] A Fairly Complex Design Complete, wishing to implement using all CSS
Hi Everyone, We just received a final design for a new website, in Photoshop format. It looks good and meets the need... And it is fully approved by the client. Now, I could do what I've always done -- slice it up using Adobe ImageReady and output it as HTML/Tables. But I recently did an output using CSS instead, and JUST as I've always wanted, I ended up with a very clean separation of content from layout using absolute positioning. However, the main content area is of dynamic length, and I ran into trouble when it was too long - it overran the footer, and no amount of CSS experimentation would fix it. So, I am ready to start over and reslice the template... But I'd really like the guidance of a CSS expert to help me slice this template up properly so that it does what I want, but in CSS. The main problem is, I only have about $100 left in the budget to get a guru's assistance. This was a fixed-bid project for a non-profit client. That amount is generally insulting to experts, but I'm wondering if perhaps for that amount, someone here would be willing to assist off-list, and just point me in the right direction using the tools that I have available to me. I could provide a JPG of the layout, and perhaps the right person could give me a better starting point than I have right now...? Finally... I am (BRAND) new to the list - please accept my apologies if this post is offensive in any way, as I have not had time to lurk and observe the true etiquette and nature of the list. I just want to get this done, but if a CSS-only layout is too much for this design, I'll have to go back to regular tables. Thanks for whatever help you can provide... M __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS onclick event?
Design Groups wrote: Here's an odd one...and this is purely for theoretical purposes. I was just wondering if there was any possible way to have a link remain one color until another one is clicked upon, using *only* CSS. For example, if you had a UL list comprised of 5 links, would it be possible to hover over Link1, have the background color change, and when you clicked on it, it would *remain* the background Shelly, I may be missing something here, but clicking on Link1 should load a new document isn't? --- Regards, Thierry | www.TJKDesign.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS onclick event?
Christian Montoya wrote:
On 5/17/06, Design Groups [EMAIL PROTECTED] wrote:
Here's an odd one...and this is purely for theoretical purposes.
I was just wondering if there was any possible way to have a link
remain one color until another one is clicked upon, using *only* CSS.
a:active { color:whatever; }
a:active,a:focus { color:whatever; }
---
Regards,
Thierry | www.TJKDesign.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS onclick event?
On 5/17/06, Design Groups [EMAIL PROTECTED] wrote:
Christian Montoya wrote:
a:active { color:whatever; }
Yes, but that only works when you click the button (or mouse down).
When you unclick and move away, the color doesn't remain behind, it
reverts to the visited color. What I'm looking for is the active
state to stay, until another link is clicked.
Stu has managed to work around that issue. I don't have time to dig
for an example, but he has pure CSS examples where the link stays
clicked. I think if the link is href=# it works... someone please find
an example: http://cssplay.co.uk/
Also I think Thierry has it right, a:active, a:focus.
--
--
Christian Montoya
christianmontoya.com ... rdpdesign.com ... cssliquid.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Images in liquid / elastic layouts.
I thought I could get the graphics to expand (Latin text box) using a rounded corners method. However the box breaks up as the text is enlarged. So being aware of the various limitations and knowing the chances one takes are there some guidelines to follow when using images in a liquid design? Hope this makes sense Mark The problem here is the images, they /don't /change size. If you can find a way to give the content area a repeating background image or make the four corner images larger then its alright (at least for a few more text sizes up). I'd go with a reapeating background personally. Rob __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] A Fairly Complex Design Complete, wishing to implement using all CSS
Finally... I am (BRAND) new to the list - please accept my apologies if this post is offensive in any way, as I have not had time to lurk and observe the true etiquette and nature of the list. I just want to get this done, but if a CSS-only layout is too much for this design, I'll have to go back to regular tables. Thanks for whatever help you can provide... M Any sample pages or links? __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] [ADMIN] Re: A Fairly Complex Design Complete, wishing to implement using all CSS
Finally... I am (BRAND) new to the list - please accept my apologies if this post is offensive in any way, as I have not had time to lurk and observe the true etiquette and nature of the list. I just want to get this done... Hi Marc I'm afraid that mentioning offering money for help is strictly against the spirit of the list. Your wanting to get things done in a hurry is no excuse for doing so. Please read the list's charter, http://www.css-discuss.org/policies.html the posting guidelines, http://css-discuss.incutio.com/?page=PostingGuidelines and review what's off topic http://css-discuss.incutio.com/?page=OffTopic and then come back and ask some practical questions about CSS. Incidentally, the css-d wiki has a wealth of info and resources... http://css-discuss.incutio.com/?page=UsefulResources Alex Robinson css-d moderator __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] [tech] cached images not displaying
This is a problem I've been wrestling with on and on for the last few months. It has been extremely difficult to get a handle on, since it is intermittent and often difficult to reproduce. I am bringing it to this list because it may be a CSS problem; it could also be an IE quirk, and am hoping somebody else may have experienced this problem.. The HTML validates perfectly, and the CSS is conservative level 2 and correct, as far as I can tell. The issue: I'm testing on XP Home, using Firefox 1.5 and IE 6. No problems with Firefox. With IE, a series of 60x60 gif images are inconsistently being displayed. Sometimes they show, most often when I flush the browser cache or start up clean. But usually I just get a small empty box where they should be. I have a light border around each one, so I can see where they are supposed to be. I tried saving as web page complete, and this version always shows all the images, leading me to suspect something about the way the pages are being served. This is on a shared server at dreamhost, using: Apache/1.3.33 (Unix) mod_throttle/3.1.2 DAV/1.0.3 mod_fastcgi/2.4.2 mod_gzip/1.3.26.1a PHP/4.4.2 mod_ssl/2.8.22 OpenSSL/0.9.7e, with Zend memory manager. But since the problem never occurs with Firefox, I haven't been thinking too hard that the server is at fault. Here is one thing I noticed - I specified width and height attributes for the images. If I right click on an image (or where it should be) and look at its properties, I see the correct width/height images. But the size, created, and modified fields all show not available. With the version I saved on my computer on local disk, which always displays correctly, has the correct values filled in for these fields. If I view the access log as I reload the page after clearing the cache, I see the image requests, with a status code of 200, and a correct size of 480 bytes. I don't know why the size/created/modified values aren't available when I look at the image properties, but think this may be a valuable clue. Can anyone shine light on what this means, and why it is happening? __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] A couple of odd spacing issues...
Hi all, I could really use some help with 2 spacing issues on this page: http://indigopear.com/Clients/rcjl/Index.html The css is here: http://indigopear.com/Clients/rcjl/style.css 1. Margins/padding are set to 0, yet the photo boxes have a space between the rows in Firefox and Opera. 2. In IE6, there is a space at the bottom of the header (above the orangey line). The wierd part is that if you roll over one of the square box links the gap closes up some, and then it expands again when you roll over the top menu. Any insights about what's going on here? Thanks! -Ann __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] border-collapse bug. (?)
Hi All - I've run into what appears to be a bug, but haven't been able to find any documentation on it. Essentially I'm working with a table with a width of 100%. On the top and bottom of the table are divs with a width of auto (to allow for inner padding). These are used for pagination, etc. The table has a border applied to all the table cells. The divs and table have the same exact width and are fluid. That is until I set border-collapse to collapse. When collapse is applied, the left side of the table extends over 1 pixel in Firefox and 1 pixel over to the right in Safari. I forget what it does in IE, I'm away from my test PC at the moment. Has anyone else run into this behavior, know what the cause is, workaround, etc? My guess is that the calculation of the table width is different (and for some reason off) when border collapse is set to collapse. But it's just that.. a guess. Mostly based of the W3C spec: http://www.w3.org/TR/REC-CSS2/tables.html#collapsing-borders I've set up a test case to demonstrate what I'm talking about. Any help is appreciated. Test Case: http://jimbarraud.com/lab/borderCollapseTest.html Thanks - Jim __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] A couple of odd spacing issues...
Ann Adamcik wrote:
http://indigopear.com/Clients/rcjl/Index.html
http://indigopear.com/Clients/rcjl/style.css
1. Margins/padding are set to 0, yet the photo boxes have
a space between the rows in Firefox and Opera.
Try:
img {display: block; add
border: none;
}
2. In IE6, there is a space at the bottom of the header (above
the orangey line). The wierd part is that if you roll over one
of the square box links the gap closes up some, and then it
expands again when you roll over the top menu.
Add, this star hack at the bottom of the style sheet and see if it helps:
* html #header { height: 0; }
Any insights about what's going on here?
No clue, whatsoever. Others on the list may have better ways of
resolving these issues.
Thanks!
-Ann
Regards,
~davidLaakso
--
http://www.dlaakso.com/gustave/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] funny space on div in FF
Hello, I have a situation where I have a div id=content that follows a div id=navbar. FF shows a small space between the 2 div's, that is until I put a border around the div id=content. When I do, the div is pulled up flush with the top div with only the border in between. I've seen this behavior before but have never figured out why it happens. The reason it is a problem on this particular page is because I have a bg image that I need to be flush with the top div. You can see this behavior using FF at this address: http://tibbits.ca/test/Camprotary.ca/info.php If you use IE you can see that it looks the way I want it to. Have I made a mistake in the way I've coded this, or is FF behaving the way it is supposed to? I could put a border around it as a temporary fix, but then there would still be a 1px space between the top of the image (div id=content) and the top div (id=navbar). If anybody could point me in the right direction on this, I would much appreciate it. Thanks, Matt __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] border-collapse bug. (?)
On May 18, 2006, at 8:55 AM, Jim Barraud wrote: Essentially I'm working with a table with a width of 100%. On the top and bottom of the table are divs with a width of auto (to allow for inner padding). These are used for pagination, etc. The table has a border applied to all the table cells. The divs and table have the same exact width and are fluid. That is until I set border-collapse to collapse. When collapse is applied, the left side of the table extends over 1 pixel in Firefox and 1 pixel over to the right in Safari. I forget what it does in IE, I'm away from my test PC at the moment. Has anyone else run into this behavior, know what the cause is, workaround, etc? My guess is that the calculation of the table width is different (and for some reason off) when border collapse is set to collapse. But it's just that.. a guess. Mostly based of the W3C spec: http://www.w3.org/TR/REC-CSS2/tables.html#collapsing-borders I've set up a test case to demonstrate what I'm talking about. Any help is appreciated. Test Case: http://jimbarraud.com/lab/borderCollapseTest.html It is more complicated, or simple..;-) The border on a table is put half inside, half outside Put a 10 px border on it, and then a 5 px border on td/th, and you start to see what happens [1]. And check out the illustration under 17.6.1 [2] Gecko is correct in this. The problem, as far as your test case is concerned, how to slice 1px in two on screen :-) Safari puts it all inside, while Gecko puts it outside (and Opera always put it inside, anyway, which is wrong according to css2.1). IE barely understands border-collapse, so it goes on another trip. [1] or look here: http://dev.l-c-n.com/tables/borderCollapseTest.html [2] http://www.w3.org/TR/REC-CSS2/tables.html#borders Philippe --- Philippe Wittenbergh http://emps.l-c-n.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] funny space on div in FF
On May 18, 2006, at 10:25 AM, Matt Tibbits wrote: I have a situation where I have a div id=content that follows a div id=navbar. FF shows a small space between the 2 div's, that is until I put a border around the div id=content. When I do, the div is pulled up flush with the top div with only the border in between. I've seen this behavior before but have never figured out why it happens. The reason it is a problem on this particular page is because I have a bg image that I need to be flush with the top div. You can see this behavior using FF at this address: http://tibbits.ca/test/Camprotary.ca/info.php it is a margin-collapse issue. The problem doesn't happen in IE because the container 'hasLayout' [1] which prevents the margin on the h1 from 'escaping'. Firefox, Safari, Opera, iCab, IE mac, and any browser that supports css 2.x reasonably all show this. Adding a border to the div in question fixes this as you discover; better could be: give the div a small padding (1px) or larger padding (1em) and then zero out the top margin on the h1. [1] http://www.satzansatz.de/cssd/onhavinglayout.html Philippe --- Philippe Wittenbergh http://emps.l-c-n.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] funny space on div in FF
Matt Tibbits wrote:
I have a situation where I have a div id=content that follows a div
id=navbar. FF shows a small space between the 2 div's, that is until I
put a border around the div id=content. When I do, the div is pulled up
flush with the top div with only the border in between.
[ ... ]
http://tibbits.ca/test/Camprotary.ca/info.php
You're running into a problem with collapsing margins. Adjacent
vertical margins are combined into one, and placed at the top. When you
place the border there, the margins are no longer adjacent. It's the
margin from the H1 inside div#info whose margin is escaping. This can
be somewhat counterintuitive, but seems to be to spec:
http://www.w3.org/TR/CSS21/box.html#collapsing-margins
You can fix it simply with:
div#info h1 {margin-top: 0; padding-top: 1em;}
This reduces the offending margin to nothing and then adds back the
desired space as padding.
Cheers,
-- Scott Sauyet
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Fun header challenge?
I'm trying to make what should be a simple header. Problem is that I want it to expand properly with enlarged text sizes. The entire header has a background color. In the center is a centered h1 for the page title, and at the left is an img (a transparent png logo) followed by a span containing the site title. Here's where it gets fun. The logo, of course, is a fixed height. It has more height than I want the background color to be at normal text size. I want the difference in height to be split above and below the colored background. So if the logo is 100px high, and the background color is 80px high, i want the image to start 10px above the background color, and overflow 10px below it. I also need short text above the header. Here's a graphic: http://www.kennygraham.net/help/small.png That I can do. But not in a way that works with text resizing. When the text enlarges, I want the background color to expand to stay 3x as high as the h1, for the logo to stay centered within the background color, and for it all to stay below the text above the header. Here's the good news: I don't need it to work in IE. I'll be serving it as xhtml, so I'm only concerned with modern browsers. Here's a playground with a blank css file for anyone who wants to give it a shot: http://www.kennygraham.net/help/index.xhtml TIA, Kenny __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Fun header challenge?
I'm trying to make what should be a simple header. Problem is that I want it to expand properly with enlarged text sizes. The entire header has a background color. In the center is a centered h1 for the page title, and at the left is an img (a transparent png logo) followed by a span containing the site title. Here's where it gets fun. The logo, of course, is a fixed height. It has more height than I want the background color to be at normal text size. I want the difference in height to be split above and below the colored background. So if the logo is 100px high, and the background color is 80px high, i want the image to start 10px above the background color, and overflow 10px below it. I also need short text above the header. Here's a graphic: http://www.kennygraham.net/help/small.png That I can do. But not in a way that works with text resizing. When the text enlarges, I want the background color to expand to stay 3x as high as the h1, for the logo to stay centered within the background color, and for it all to stay below the text above the header. Here's the good news: I don't need it to work in IE. I'll be serving it as xhtml, so I'm only concerned with modern browsers. Here's a playground with a blank css file for anyone who wants to give it a shot: http://www.kennygraham.net/help/index.xhtml TIA, Kenny __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] border-collapse bug. (?)
On 5/17/06, Bill Brown [EMAIL PROTECTED] wrote: Hi Jim, I know this is a thanks for nothing kind of reply, but I just wanted you to know that I did extensive testing on your test case and could not resolve the issue either. I tried setting widths on the divs, relative positioning, margins, paddings, resizing the window, the whole nine yards and came up with nada. I don't have Safari; IE on Windows came up ok (gasp) but Firefox had the tell-tale, immutable 1px left offset just as you indicated. If nothing else...I figure misery loves company, so I thought I'd share my findings with you. Sorry I couldn't be more helpful. --Bill Bill - Thanks for the ol' college try. Yea, I've been pulling my hair out about this for a while. My only workaround is to forget the border-collapse and resort to top and right borders on the td /'s then creating the exception classes for the td / border's meet the containing table border, which is messier then I want to go. The thing that bugs me the most is I can't find any documentation on this little anomaly. Jim __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] border-collapse bug. (?)
On 5/17/06, Philippe Wittenbergh [EMAIL PROTECTED] wrote: It is more complicated, or simple..;-) The border on a table is put half inside, half outside Put a 10 px border on it, and then a 5 px border on td/th, and you start to see what happens [1]. And check out the illustration under 17.6.1 [2] Gecko is correct in this. The problem, as far as your test case is concerned, how to slice 1px in two on screen :-) Safari puts it all inside, while Gecko puts it outside (and Opera always put it inside, anyway, which is wrong according to css2.1). IE barely understands border-collapse, so it goes on another trip. [1] or look here: http://dev.l-c-n.com/tables/borderCollapseTest.html [2] http://www.w3.org/TR/REC-CSS2/tables.html#borders Philippe --- Philippe Wittenbergh http://emps.l-c-n.com I see. Thanks for the response, this does help explain things. This may help me in figuring out an alternative. Jim __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] [tech] cached images not displaying
Phil Glatz wrote: [images often not displaying in IE] I don't know why the size/created/modified values aren't available when I look at the image properties, but think this may be a valuable clue. Can anyone shine light on what this means, and why it is happening? I think we need another clue. How about a URL to the problem page? -- Els http://locusmeus.com/ http://locusoptimus.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
