[css-d] DIV wrapping
Hello,
First of all this is my very first post here, so please forgive me for
possibly being off on something.
I got a CSS layout question in regards to wrapping of nested DIV
elements. How can I make sure that a set of images each placed in a DIV
element wraps inside of a parent DIV like those images would without a
div around them? The reason I want to wrap each image in a div is
because I would like to have description under each one of the images.
Maybe there's another way of adding image descriptions without having to
use tables. Please enlighten me if that's the case.
Below is the code in its simplest form, plus you can go to
http://www.p1x44r.com/journal/view.php?id=imstillalive
http://www.p1x44r.com/journal/view.php?id=imstillalive to view the
original. The code below is by no means final as I keep playing with it,
I just pasted what I had there at the moment.
div class=imagebucket
div class=imageholderimg class=image
src=/images/content/imstillalive/thumb_1.jpg /br/I would like image
description to go in here./div
div class=imageholderimg class=image
src=/images/content/imstillalive/thumb_2.jpg /br/I would like image
description to go in here./div
div class=imageholderimg class=image
src=/images/content/imstillalive/thumb_3.jpg /br/I would like image
description to go in here./div
div class=imageholderimg class=image
src=/images/content/imstillalive/thumb_4.jpg /br/I would like image
description to go in here./div
div class=imageholderimg class=image
src=/images/content/imstillalive/thumb_5.jpg /br/I would like image
description to go in here./div
/div
Here's CSS for all those classes.
.imagebucket {
background-color:#EFECDF;
padding:10px 10px 10px 10px;
text-align:center;
margin-left:auto;
margin-right:auto; }
.imageholder {
display:table-cell;
width:200px;
background-color:#FF;
border:1px solid #A8A391;
padding:4px 4px 4px 4px;
margin:5px 5px 5px 5px;
}
.image {
border:1px solid #A8A391;
padding:1px 1px 1px 1px;
cursor:pointer;
margin:5px 7px 5px 7px;
}
Thanks much for your help, it is greatly appreciated!
--
Vitali Doudko
Programmer-Analyst
Smartbox Equipment Inc.
4150 St. Catherine Street West, Suite 200
Westmount, Quebec, Canada, H3Z 0A1
Tel: (514) 398-9355 x204
Fax: (514) 398-9172
E-mail: [EMAIL PROTECTED]
__
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] Page check please.
Hi all I've made some changes since my last post, I think it now works in the following: FF1.5, IE6, IE5.5, Opera 9 (XP) I believe there are issues in Netscape, Mozilla, Safari and IE5 Mac, would anyone be able to check these and any other platforms/browsers for me please. I think ideally I would like it stable in IE6/5.5, IE5 Mac, FF, Safari. Opera would be nice (I think it works in 9) as would Mozilla (which I think has a similar bug to Netscape). If anyone finds any problems I would appreciate any pointers or advice as I am now at the end of my CSS knowledge :( I've used some hack management now as I was getting confused and can hopefully drop them one by one in the future. The main files are below and the ie5mac.css just sets the main content text to green to check if the filter is working, could someone confirm please. The portfolio link works to test 'you are here' in the main navigation. http://public.softectra.com/070706_1/index.html http://public.softectra.com/070706_1/w3c.css http://public.softectra.com/070706_1/ie6.css http://public.softectra.com/070706_1/ie55win.css http://public.softectra.com/070706_1/ie5mac.css Thanks. Mark. __ 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] Font Colouring
Hi Could you please take a look at this site: http://www.wilsonsjewellery.co.uk/ and tell me why black is not black and more a shadowy grey. Confuses me! The css is at: http://www.wilsonsjewellery.co.uk/style/default.css Many thanks. -- Rich http://www.cregy.co.uk Embracing what God does for you is the best thing you can do for him. Romans 12 v 1 __ 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] DIV wrapping
Vitali Doudko wrote:
Hello,
First of all this is my very first post here, so please forgive
me for possibly being off on something.
I got a CSS layout question in regards to wrapping of nested
DIV elements. How can I make sure that a set of images each
placed in a DIV element wraps inside of a parent DIV like those
images would without a div around them? The reason I want to
wrap each image in a div is because I would like to have
description under each one of the images.
Maybe there's another way of adding image descriptions without
having to use tables. Please enlighten me if that's the case.
I recently updated a testcase - feel free to study the code :-)
http://locusmeus.com/test/thumbswithcaptionslistcentered.html
(links image and caption separately)
http://locusmeus.com/test/thumbswithcaptionslistcenteredcombo.html
(links image and caption together)
Below is the code in its simplest form, plus you can go to
http://www.p1x44r.com/journal/view.php?id=imstillalive
http://www.p1x44r.com/journal/view.php?id=imstillalive to
view the original. The code below is by no means final as I
keep playing with it, I just pasted what I had there at the
moment.
[snip]
.imageholder {
display:table-cell;
width:200px;
If you don't care about centering, you can just float the
imageholders. Just make sure they're all the same height, even
when fonts are enlarged, to avoid stacking.
--
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/
Re: [css-d] Font Colouring
Because you have color: #8A864E; written in many places. For black, just use color:#fff; -- 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] Font Colouring
Er, color:#000; -- Marc Luzietti Flagship Project Bayview Financial, L.P. (305) 341-5624 Because you have color: #8A864E; written in many places. For black, just use color:#fff; __ 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] Font Colouring
From: [EMAIL PROTECTED] Sent: Friday, July 07, 2006 10:19 AM Because you have color: #8A864E; written in many places. For black, just use color:#fff; I think color:#000; will produce a darker black 8-. (For those that do not recognize the notation, it is simply shorthand for #00, just as #3cf is shorthand for #33ccff.) --G __ 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 in 3D :)
Hi css-d: I'm bringing css to my work place, and they've liked it a lot, but we have a problem. We went to cssplay.co.uk for a dropdown menu and (as usual) in firefox works great, but we have a problem with the position in the IE. Take a look: http://www.utp.edu.co/egresados/index.php test the drop-down menu in IE and see what i mean. any ideas in how can I fix this? Thanks a lot! __ 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] Font Colouring - wils
On 06/07/07 16:03 (GMT+0100) Richard Brown apparently typed: Could you please take a look at this site: http://www.wilsonsjewellery.co.uk/ and tell me why black is not black and more a shadowy grey. Confuses me! It's totally unclear with its black and gray theme where black should be that it isn't. Other than the absence of specified background color everywhere, the overall color scheme seem rational enough. OTOH, it seems incongruous to find all the front and center content text smaller than all the text that surrounds it. http://mrmazda.no-ip.com/SS/rbrown6.jpg If you haven't already seen it, a look here would be a good idea: http://hsivonen.iki.fi/units/ -- If you confess with your mouth, 'Jesus is Lord', and believe in your heart that God raised him from the dead, you will be saved. Romans 3:23 NIV Team OS/2 ** Reg. Linux User #211409 Felix Miata *** http://mrmazda.no-ip.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] Why the extra vertical space?
Michael Landis wrote: On 7/6/06, Rick Pasotto [EMAIL PROTECTED] wrote: http://charlottetoastmasters.info/leaders2.php These are nested DLs. (I'm using DLs because there is a possibility of additional info for each governor -- phone, quote, picture, etc.) As far as I can see the code for the two sections is identical yet the first has additional white space above the inner DL. Why? Hi, Rick, Because each div within the lists have clear:both, they are clearing the left navigation. The reason this is happening is that clearing impacts everything within the same block formatting context.[1] So as long as the stuff inside content area is in the same context as the floated element, the float will be impacted by any clearing done there.[2] Rick, I just wrote a free article for Community MX that covers the block formatting context: http://www.communitymx.com/content/article.cfm?cid=6BC9D Zoe -- Zoe M. Gillenwater Design Services Manager UNC Highway Safety Research Center http://www.hsrc.unc.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] Border strip on leftnav
Skip Knox wrote: http://webtest.boisestate.edu/templatedev/ I have a leftnav with dark blue background and a 9px lighter blue stripe on its right. The leftnav actually has three components: logo at the top, menu area below it, and a fade below that. I keep running into problems with white space appearing as I change font size in my browser. I suspect I'm going about designing it wrong. Here's how I'm doing it now. snip I actually don't see any white gaps appearing, but I do agree that it could be done a lot more cleanly. Here's how I would do it: Take a div, give it the id #nav (or some other name more meaningful than the current leftbox), and place the image of the logo (just the logo, no light blue strip) and the ul inside. Float #nav left. Slice an image that contains the full dark blue width and light blue strip and apply this as a background to #nav, set to repeat-y. Slice another image that contains the bottom fade image. Apply this as a background image to the ul inside #nav, no-repeat, positioned to the bottom. Give the ul enough bottom padding so that its content doesn't overlap the fade image. Done. No nested divs, simple CSS, degrades well in non-CSS and non-image browsers. Zoe -- Zoe M. Gillenwater Design Services Manager UNC Highway Safety Research Center http://www.hsrc.unc.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] can't get my text to wrap!
Melissa Carraway wrote:
I'm developing a site using templates in Dreamweaver. Right now I have an
optional area that is enclosed in a DIV tag. I want the non optional content
text to wrap around the optional DIV if the DIV is present, and if it's not,
I want the copy to just take up the space. Hence the wrap. (the optional div
is of a fixed size with an image and text).
Here is what the style sheet looks like for the two elements:
#ndc-sub-06 {
position:absolute;
left:511px;
top:120px;
width:216px;
height:298px;
background-color: #cc;
}
#content {
position:absolute;
left:91px;
top:120px;
width:80%;
height:298px;
}
where #ndc-sub-06 is the optional block.
Does it matter that the optional block is placed absolutely? I tried floating
it, and all that happened was that the copy showed up OVER the block instead
of under it.
Hi Melissa,
Absolute positioning is not a good way to lay out a site. It's ok for
occasionally placing small elements within constrained areas, but not
for layout overall. I'm guessing that you've relied on Dreamweaver to
write your CSS for you, at least to some degree. This will result in
very inflexible and potentially inaccessible layouts.
I would encourage you to learn about how floats work and adopt them as
your layout method, writing CSS by hand. Floats would solve your current
problem: simply float the optional div. If it is there, the adjacent
content will move out of the way and wrap around it. If it is not there,
the remaining content will just take up all the room it can. This didn't
work on your page because you absolutely positioned the remaining
content. When you do this, it acts as though nothing else exists and
stubbornly sticks to the same spot on the page no matter what. That's
what makes it so awful for layout.
Can we see your current page? I'm sure there are lots of things we could
help you improve on your page so it works better for you.
Zoe
--
Zoe M. Gillenwater
Design Services Manager
UNC Highway Safety Research Center
http://www.hsrc.unc.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/
[css-d] floated div problem in IE
Hi all, I wonder if someone could take a peek at http://ap.projectstep.com/atlay/location_and_access/ The side menu on IE is getting shoved to the right but it looks fine on Firefox. I am stumped and would appreciate any help. 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] floated div problem in IE
looks like you have:
margin-left: 20px;
assigned to #sideBar... I seem to remeber reading that IE will double the
margin unless you add display:inline; - (google ie double margin for
details)
alternatively you could assign one value for ie and then follow with the
hack
bodyhtml #sidebar { margin-left: 20px; }
for firefox since ie will ignore this...
hope this helps...
---
Bob
www.greynation.com
From: rollandburn [EMAIL PROTECTED]
To: css-d@lists.css-discuss.org
Subject: [css-d] floated div problem in IE
Date: Fri, 7 Jul 2006 13:13:15 -0400
Hi all, I wonder if someone could take a peek at
http://ap.projectstep.com/atlay/location_and_access/
The side menu on IE is getting shoved to the right but it looks fine
on Firefox. I am stumped and would appreciate any help.
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/
_
FREE pop-up blocking with the new MSN Toolbar get it now!
http://toolbar.msn.click-url.com/go/onm00200415ave/direct/01/
__
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] What can I do about inconsistent spacing across browswers?
I understand that pixel perfect results across browsers are not realistic, but what can I do to improve this at least a little? See http://209.211.255.131/newsite/testjuly7.html. The CSS code is at http://209.211.255.131/newsite/testjuly7.css. The spacing in IE6 is much more generous than any other browsers I've tested, including NN6, NN7, and Firefox. In IE6 there is more space than I'd like between the quick links/search area at the top and the logo/header and between news and sidebar items. In NN6, NN7 and Firefox I feel like the spacing is too tight and want to add some padding. Suggestions on how to add space in those tight browsers without getting even more space in IE6? Thanks in advance for the help. Dova H. Wilson Marketing Communications Specialist George Washington University Virginia Campus 44983 Knoll Square, Rm. 305 Ashburn, Virginia 20147 Phone: 703-726-3652 Fax: 703-726-3655 www.gwvirginia.gwu.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/
[css-d] Horizontal clickables thumbnails Scroller : problem under SAFARI
hi, What I want to achieve : a video gallery. Videos would be presented as an horizontal thumbnails list scoller. When you click on a thumb, a video displays. Because I id not how to achieve that , I serahced on the web and found a script : a horiontal rectangle where X clickable (= hyperlinkled ?) thumbs display (link a on tag img), and where the others are hidden (around 10). Next and previous buttons, when they are clicked, makke the thumbs move : the one that where hidden, now display, the others are hidden under one of the DIVs. Thumbs are in a DIV which is on overflow:hidden. This DIV don't grow up when its content does : I have a frma e(or iframe) efect whithout any iframe. Under FF/Win and MacOS and under IE/Win, it's OK (I don't test under IE/Mactoo bad browser). Bit it does not under Safari... Under Safari : what works : some thumbs are displaied in the DIV container which is on overflow:hidden, the others don't : that is correct ! what does not properly work : the hyperlinks on the thumbs that don't display are still active and clickable although the images they are attached to, don't display, and that on the left of the DIV, and on its right..?!? +, those links seem to take over the effect of the hyperlinks that are on my Next and Previous buttons, that is to say when I click on one of thoses 2 btns, I active the display of a video instead of moving the thumbs in the DIV..??!?? I tried to put a z-index:9; on my buttons, but the result is still the same My analysis (which may wrong...) : using overflow:hidden with Safari, Safari seems to be able to hide cointent when it is just texte or images, but not when it is links on images...am I right ? Questions : - is that a bug ? If yes, does a specific Safari hack exist for that ? - instead, is there a way to make the wanted effect happen in Safari and the other browsers I use (FF and IE/win + FF/mac) ? Here is the page I worked on : http://plume.fuzzmedia.com/plume/live/live.php If someone have an idea, please help !!! If not, I'll be obliged to use iframes. ps : France is back !!! __ 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 strip on leftnav
Thanks, Zoe, I'll give it a try. I've managed to fix most of what was wrong, but only by fiddling rather than restructuring. I sort of have to put this to bed, but once I've got the docs done, I'll take a run at restructuring. That's what I really want anyway -- no kludges, no hacks. Thanks for the feedback. Skip Knox Boise State University [EMAIL PROTECTED] Zoe M. Gillenwater [EMAIL PROTECTED] 07/07/06 11:05 AM Skip Knox wrote: http://webtest.boisestate.edu/templatedev/ I have a leftnav with dark blue background and a 9px lighter blue stripe on its right. The leftnav actually has three components: logo at the top, menu area below it, and a fade below that. I keep running into problems with white space appearing as I change font size in my browser. I suspect I'm going about designing it wrong. Here's how I'm doing it now. snip I actually don't see any white gaps appearing, but I do agree that it could be done a lot more cleanly. Here's how I would do it: Take a div, give it the id #nav (or some other name more meaningful than the current leftbox), and place the image of the logo (just the logo, no light blue strip) and the ul inside. Float #nav left. Slice an image that contains the full dark blue width and light blue strip and apply this as a background to #nav, set to repeat-y. Slice another image that contains the bottom fade image. Apply this as a background image to the ul inside #nav, no-repeat, positioned to the bottom. Give the ul enough bottom padding so that its content doesn't overlap the fade image. Done. No nested divs, simple CSS, degrades well in non-CSS and non-image browsers. Zoe -- Zoe M. Gillenwater Design Services Manager UNC Highway Safety Research Center http://www.hsrc.unc.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/ __ 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] www.gamespot.com
hey, group. i recently asked a question about a shadow effect, but i'm still a little confused about how to create it. i really like the effect on the sides of the content area on the gamespot.com website. could anyone explain to me how to create something similar? is there a way to create the effect without using tables and with coding (both css and xhtml) that would validate? i would really appreciate any help. thanks a lot in advance. michelle __ 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] 'dropped column' (was: no subject)
Well, I suppose you could just let the software do its thing without intervention :-) ? http://www.chelseacreekstudio.com/ca/cssd/layout04.html I could, but that's not what we want to happen. So that's not a viable solution. (and thanks for fixing the 'no subject'...me = embarrassed ;o) -Darrel __ 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] (no subject)
Why not apply that fix to IE only and spare Firefox? You could do: Because...uh...umm...well...that's a good point. ;o) -Darrel __ 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] www.gamespot.com
hey, group. i recently asked a question about a shadow effect, but i'm still a little confused about how to create it. i really like the effect on the sides of the content area on the gamespot.com website. could anyone explain to me how to create something similar? is there a way to create the effect without using tables and with coding (both css and xhtml) that would validate? i would really appreciate any help. It is an image trick, is all: http://www.alistapart.com/articles/fauxcolumns/ -- Chris Heilmann Book: http://www.beginningjavascript.com Blog: http://www.wait-till-i.com Writing: http://icant.co.uk/ __ 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] stupid question regarding background position: fixed and IE6
I have been working on a site recently and I decided to make the background fixed. Well, I assigned the background fixed attribute and it works great with Fire Fox but not with IE6. Does IE 6 not support this attribute? Thanks in advance. Paul __ 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] stupid question regarding background position: fixed and IE6
On 07/07/06, Paul Seale [EMAIL PROTECTED] wrote: I have been working on a site recently and I decided to make the background fixed. Well, I assigned the background fixed attribute and it works great with Fire Fox but not with IE6. Does IE 6 not support this attribute? Thanks in advance. Paul Nope, maybe in IE7 -- http://www.web-buddha.co.uk http://www.projectkarma.co.uk __ 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] www.gamespot.com
thanks a lot for the replies. i think i got it to work :) i appreciate your help. On 7/7/06, Christian Heilmann [EMAIL PROTECTED] wrote: hey, group. i recently asked a question about a shadow effect, but i'm still a little confused about how to create it. i really like the effect on the sides of the content area on the gamespot.com website. could anyone explain to me how to create something similar? is there a way to create the effect without using tables and with coding (both css and xhtml) that would validate? i would really appreciate any help. It is an image trick, is all: http://www.alistapart.com/articles/fauxcolumns/ -- Chris Heilmann Book: http://www.beginningjavascript.com Blog: http://www.wait-till-i.com Writing: http://icant.co.uk/ __ 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] What can I do about inconsistent spacing across browswers?
On 7/7/06, Dova Wilson [EMAIL PROTECTED] wrote: I understand that pixel perfect results across browsers are not realistic, but what can I do to improve this at least a little? See http://209.211.255.131/newsite/testjuly7.html. The CSS code is at http://209.211.255.131/newsite/testjuly7.css. The spacing in IE6 is much more generous than any other browsers I've tested, including NN6, NN7, and Firefox. In IE6 there is more space than I'd like between the quick links/search area at the top and the logo/header and between news and sidebar items. In NN6, NN7 and Firefox I feel like the spacing is too tight and want to add some padding. Suggestions on how to add space in those tight browsers without getting even more space in IE6? Hi, Dova, Welcome to the world of inline formatting contexts! Basically, you're running into several rules -- and interesting interpretations of those rules -- that impact: * what the top of a float aligns to [1] * how inline elements work [2] * how floats are supposed to expand beyond their container[3] and don't in IE[4] It's a lot to swallow in one gulp. For the case you have here, though, it is probably easier to forgo floats altogether and position the search box absolutely on the right edge of the content area. I've done this as a sample at http://www.michael4css.info/examples/gwu/testjuly7.html. HTH, Michael [1] http://www.w3.org/TR/CSS21/visuren.html#float-position, rules 4 through 6 [2] http://www.w3.org/TR/CSS21/visuren.html#inline-formatting [3] http://www.w3.org/TR/CSS21/visuren.html#floats [4] When you add a dimension to an element containing a float, the element will incorrectly wrap around the float in IE. This is probably the reason you are seeing excess spacing in IE. __ 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] stupid question regarding background position: fixed and IE6
On 07/07/06, Paul Seale [EMAIL PROTECTED] wrote: Well, I assigned the background fixed attribute and it works great with Fire Fox but not with IE6. Does IE 6 not support this attribute? IIRC yes, it does, but only on the body element. Cheers, -- Olly http://thinkdrastic.net/ __ 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/
