Re: [css-d] IE6 footer problem
Jake McMurchie wrote: http://www.beyondcurrenthorizons.org.uk/background/news/ In IE 6, when you hover over the items in the top (horizontal) navigation bar, the footer jumps up to just below the level of the righthand sidebar. Seems fine in other browsers. Does anyone know why this is happening and how I can fix it? Have Googled so far to no avail... That looks like an old familiar friend. Well, bug. http://www.positioniseverything.net/explorer/guillotine.html -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Background position limitations in CSS 2.1
Usamah M. Ali wrote on Thursday, June 25, 2009: There is a fundamental limitation of CSS's property background-position that becomes apparent and annoying when working with RTL documents. The problem is that when value lengths to determine the position of an image, the position is by default calculated from the __top left__ corner of the element. When working with RTL documents, the desired position is supposed to work contextually, thus should be calculated from the __top right__ corner of the element. The workaround this is to use only keyword and percentage values. Negative values of course, do not work out since they serve a purpose in this regard. background-position: 4px center; If we used: background-position: right center; it will work, but we will ose fine-grained styling. Another workaround until CSS has caught up, would be to add the 4px in transparency to the image itself. A hassle if one image needs to be re-used in different situations/spacings, and works only for gifs and pngs of course, but provides pixel precise styling. -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Need help with backgnd img of 2 column layout container div
Charlie Kalech wrote: I am using a container div around a floating and non-floating div My problem is that if I define the background image on the container div and have it repeat vertically, it only repeats according to the height of the non-floating div and if the floating div is longer than the non-floating div, the background stops in the middle of the page! /div id=content-body /div wrapper P.S. I have also tried adding a footer with clear:both after the content-body div within the wrapper. It appears correctly, but the background on the wrapper still stops with the non-floating column. I'll believe that one when I see it ;-) Any element within wrapper and after content-body, should make the background extend till the bottom. However, did you really use /div wrapper in the code? Does the validator accept that? -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Need help with backgnd img of 2 column layout container div
Charlie Kalech wrote: Thanks I retried and it worked - strange! Not strange at all - it's strange that it didn't work before ;-) I have to label my closed divs otherwise I get lost! This is how I do that: /div!-- #wrapper -- -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Weird spacing in IE (go figure)...
Michael Beaudoin wrote: Now, I have a little bit of a spacing problem. All my page look good in Safari, Firefox Mac and PC, but the LINKS and DOWNLOADS pages have this big space in them in IE. Would someone please go to http://www.mhinonline.com/dev and see what I have missed, or didn't do? The width of #textarea is set to 670px. The width of the paddings of #textarea p are 143px together. The width of the images used for the subheadings is 545px. 545 + 143 = 688, which is 18px too wide. Firefox just follows your orders and lets the image stick out. IE doesn't. It tries to fit it in somehow. (without real success, but by the gap you can see it tried ;-)) -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] My footer background image is misplaced in IE 6
Michael Stevens wrote:
http://testsite1.bigmikes.org/
http://testsite1.bigmikes.org/jbc.css
In FF the pages render fine but in IE the footer image is not being
placed {bottom right no-repeat} as I've requested. It's cramming it
up at the top of the footer div which puts the pattern right in the
middle instead of at the bottom of the page.
It's not that the background image isn't at the bottom right, it's
that the footer is only 20px or so high. (in IE6)
I can't see anything wrong but I don't spend as much time
jury-rigging IE as a lot of you do. Without FireBug it's difficult
to figure anything out. Haven't checked IE7.
IE7 behaves the same as FF for this page, and the reason it doesn't in
IE6, is that you have used min-height to set the height of the footer.
IE6 does not support min-height, and because all the content of the
footer is floated, there is no automatic height. (floated elements are
'invisible' to their parents).
For IE6, you can add _height:65px; (the underscore will hide it from
the better browsers).
--
Els
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Condensing BORDER-xxx-STYLE
trevor bayliss wrote: How can I condense this CSS? Is it possible? thank you BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none; border-style:none; See http://www.w3.org/TR/CSS21/propidx.html for a complete list of possibilities. (well, for CSS2.1). -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] proper use of cite
Brian Hazelton wrote: If I put in the footer site by xxx would that be a proper use of cite or should I just use a p? According to this reference: http://dev.w3.org/html5/spec/Overview.html#the-cite-element it doesn't look like cite would be correct use for 'site by .. '. I'd use p for that line. -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] How to set div opacity
Chike Loney wrote: How do I set the opacity of a div to let's say 50% opacity:0.5; http://www.w3.org/TR/css3-color/#opacity Not sure which browsers support it, and also has the disadvantage that the text in the div will also become transparent. If the background of the div is a solid colour (rather than an image), you might want to try using rgba() values for the background colour instead. Again, not sure which browsers exactly support it. But using rgba(), the text in the div will keep its colour instead of becoming transparent with the div's background. http://www.w3.org/TR/css3-color/#rgba-color -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Padding Browser Issue
taestrada wrote: In IE7, the photos and the 2009-2010 Outdoor Programs have the same padding and the tops line up (as intended). But in Firefox, the Outdoor Programs box is about 9 pixels higher. I can't figure out why. Any ideas? http://wildernessawareness.org/index1.html The top margin of the h2 collapses with the top margin of the #rightCol, forcing the #sidebar1 to extend upwards to encompass the h2's margin. Fix: set that h2 inside #sidebar1 to have a top-margin of 0, or add a border-top to #sidebar1. -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problem with a header image in Opera 9.64
Krystian - Sunlust wrote: I'm using Opera 9.64 on Windows 7 Beta. This website: http://maleconcept.com/test/ Has the header image centered right, but on opera it slides a bit to the left. Any ideas what bug is causing it or how to fix it? I see the same effect in Opera 9.63 on Windows XP. Somehow Opera makes the image longer than it is. If you set the position to 'right top' instead of '50% 0', you'll see that the grey block on the right is double the width. This is not a problem with the image itself, as when I call it in the browser separately, it shows it correctly, 5 equal size grey blocks on either side of the image. I'd say it's a bug, but I don't know what causes it. I'd be interested to see what happens if that image would have two thin red borders on left and right side - would that red border be extended for 100 pixels, or is there something else happening? -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Javascript code - firefox vs explorer and spry menu bars
Tarah - Dome Cleaning, Inc. wrote: Hey - I have this code %...@language=JAVASCRIPT CODEPAGE=65001% that is appearing on the top of my site when opened in firefox - but not explorer. Here is my site in progress: www.domecleaning.com/devhttp://www.domecleaning.com/dev It was suggested to remove the tag from my code, but when I do that, the background on my spry menu bar on the drop down changes from a box around the text, to being a jagged end - ending at where the text ends. Does anyone know how to hide this code so that it won't appear in firefox? A wild guess, and it's also OT for this list, but what happens if you rename index.html to index.asp? -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Margin Collapsing down to the html element itself
Robert O'Rourke wrote:
I've been working on a site and just at the stage of tidying up the
CSS however I have a strange problem with margin collapsing. It
looks like there is some unwanted margin on the HTML element itself
which is really confusing me. I've been trying all sorts to fix
this problem. Putting a border on the BODY tag made that border
encroach into the unwanted margin at the bottom of the page but not
remove it. I'm at a loss here. The page is at
http://www.sanchothefat.com/dev/tc/ and the unwanted space is at
the bottom of the page in the latest Firefox and Opera but not in
Safari or Chrome. I'm still working on some IE fixes, it's the
margin issue I want to eliminate in FF and Opera for now.
Please help!
Some script is inserting an image below div#wrap:
img alt=Loading id=l
src=/dev/tc/wp-content/themes/treecarving/gfx/green-loady.gif/
This image has a style set too, on line 703 of your style.css:
#l {
left:-999px;
position:absolute;
}
Even though it's sitting 999px to the left of the screen, it's still
taking up its height.
If you also give it a negative top value, it wouldn't.
--
Els
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Margin Collapsing down to the html element itself
Bobby Jack wrote: As ever, Firebug is your friend. The extra space is not a margin, but the slightly strange image at the end of your document. The one with an ID of 1 which, BTW, is invalid. That's what I thought at first too, but it's actually the letter 'l'. (lowercase L). -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Strange lack of hover effect on BOTH IE6 and IE7
Phil Matt wrote:
In IE, NOTHING happens when you hover over the small GIF image -
which is a graphic created from a specific font. The idea is to
simulate the typical text-decoration you'd see on an ordinary text
link. In FF, the expected red lower border appears on hover. Here's
the code snippet:
[snip]
a:link img {
text-decoration:none;
padding:0;
margin:0;
border:0;
}
a:hover img, a:active img {
border: 1px solid red;
border-width: 0 0 3px 0;
padding:0;
margin:0;
}
[snip]
Your example works on IE7 here.
In IE6 you'll need a trigger. IE6 will not show any hover effects on
children of the a element, if the a element itself does not have
any hover effect.
Try a hover effect on the link that won't be noticeable, such as
'background-position:left top'. The default is 'center', so 'left top'
is a change, while it won't affect anything on the page since you
didn't have a background set anyway.
--
Els
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Q and A (Question and Answer) format using ul
Stephen Tang wrote: I know the background image technique is well-known (http://css.maxdesign.com.au/listutorial/introduction.htm), but since in this example, it's just Q and A, I was hoping there is a way not to use images. I think that Q and A should be part of the content, not the styling. Without CSS and without images, the content of the page should still make sense, so I reckon you'll want to have the images for Q and A with alt text, or just plain text, in the HTML? -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] ie7 not showing link as link
Göldi wrote: [login link on the top left] http://www.sma-partner.ch/index.php?option=com_contentview=sectionlayout=blogid=7Itemid=38lang=en If I disable all css stylesheets (using IE Devtoolbar) the link works. It also works if you only disable the IE7 stylesheet. The navigation then drops to the next line. It also works if you take off the -22px margin on the login. I think it is overlapped by something because of the negative margin. Either way, if you add 'position:relative;' to the styles for #navigation,#login in the IE7 stylesheet, the link is clickable. -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Css Problem with IE
Nic Pulford wrote: I've been struggling with an IE problem. See the following http://www.leadersmith.org.uk/gt/test3.htm its extracted from a site I'm working on. The last member has the name missing (its Member). Its there in the html but is not showing. If I remove the background color I can then see all the names, but I need the background white. Works fine in Opera and FF. Fails in IE 6 and IE 7. Any Ideas. Good old peek-a-boo, caused by clearing styles. If you add a nbsp; inside the last div class=clear/div, the problem is gone in IE7. This might just be an unnecessary hack though, see below. Can't test in IE6 really, as in my version it doesn't even show any of the names - my version is JavaScript-cripled, could have something to do with that. Could also be due to errors in the code, as you have 4 divs, each with id=userBox, and also 4 with id=userboxbuttons. You can't have multple IDs with the same name on one page. Best to change those IDs to classes, so they can be reused on the page. -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] :hover problems in IE
Climis, Tim wrote: I've got a problem with IE and :hover. As you can see in the stylesheet, the :hover is being applied to an anchor tag, so it should work. But when I hover over the link, nothing shows up. Is there anything you all see that might be causing problems? Looking at your code, I see you have a span inside your links. IE has problems with :hover styles on spans inside links sometimes, but they are easy to fix. Not sure that this is what causes your problem though, as you are trying to change the background of the a element, not the span. Could be that the styles do change, but the span hides them? Or maybe the a element doesn't extend its height around the span, and therefore there is no visible hover effect. I think it would be best if you supply a URL with the example that shows the problem. Makes it a lot easier to determine the problem. This would also show what doctype (if any) you are using, which can have an effect on how IE7 renders a page too. -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] :hover problems in IE
Climis, Tim wrote: So I now have a new question: how can I give an empty link height in IE? Since the height property in the css isn't working. That would only work on block level elements, so 'display:block;' would do the trick. But that may not have the desired result if you're planning on displaying the links horizontally next to each other. If you want to do that, you'd have to float them. The whole point of this is to have the previous/next images be styleable via the stylesheet, instead of hardcoded in the javascript, which is why I want the background images instead of actual images. (if this is getting off-topic let me know, and I can move over to The List) So why don't you use an actual transparent gif as filling for the link? Transparent means see-through, and as long as the transparent gif is safely sitting on the server in the right place, no broken image symbol. The transparent gif only needs to be 1px in size, and you can stretch it by just setting width and height on it. http://www.indiana.edu/~intlserv/ic/programs/coffee_hour_gallery.php Click on any of the thumbnails, and it'll get the script started. Ah, *those* prev and next images. I don't see the problem with those being hardcoded into the JavaScript, as all you'd need to do to change them, is replacing the image files that are used there. Even easier than updating a stylesheet. -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] :hover problems in IE
Climis, Tim wrote: That would only work on block level elements, so 'display:block;' would do the trick. That's what I thought, but I get them display:block already. If the element has display:block, it should respond to the height property as far as I know. Looking at the page in Firefox and checking with Firebug: the display:block is on the span, not on the a element. Try what happens if you set the display:block and a height on the a element - should really work. -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Element alignment.
bruce.som...@web.de wrote on Saturday, March 7, 2009: Yes, it wouldn't make much sense to have the menu scroll off screen We differ in opinion there. It does makes sense to have the menu scroll with the rest of the page, so that every part of it can be accessed. I have no idea how to accommodate those with minute screens. Very simple: let everything scroll naturally. My Blackberry has a 5.0 x 4.7 cm screen and a web browser. I have found no use for it. Perhaps for displaying a list of stock quotations. But what else? Even if I were able to scroll the menu and see all entries, I wouldn't know how to select anything with no cursor. That's just you though ;-) I use a Nokia N73, with a 2x3 cm screen, and I surf the web all the time. There is a cursor, and you can use it to click on things. Before this, I had an older phone, without cursor, but that one just highlighted link after link, so I could still surf the web and follow links. I'm sure your Blackberry is good enough to surf the web if you tried. I'm afraid I'll have to be fresh enough, or perhaps unpleasant enough, to say that the site is not compatible with toy screens. Your prerogative, but toy screens are on the rise - 640x480 and 800x600 are quite common. EEE pc and similar laptops don't really have minute screens. Oh, and there is of course the iPhone. Also 640 x 480 I think? -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Element alignment.
bruce.som...@web.de wrote: But the following must be CSS: Again at http://www.maireadnesbitt.com/initial.html - how can the borders on leftcontent and rightcontent extend out the bottom of the window? rightcontent: height: 100%; border: 4px double black; 100% plus 4px is more than 100%. leftcontent: height: 120% border: 4px double black; 120% plus 4px is also more than 100%. BTW, because of position:fixed, the side columns won't scroll. Probably what you intended, but it means that people on the new fancy smaller screens won't see the links that are below their screen. -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Breaking Templates in Columns
GPL wrote: I have a live DEV site up now, but it seems to do it to more than just the shoutbox: http://tinyurl.com/dy7t79 IT DOES IT TO ALMOST ANYTHING ON THE RIGHT and left SIDE COLUMN. Scroll the page slowly and look at the right side column as it does the effect in the picture above. I only see this in IE. I'm lost with out firebug helping me tinker, so if anyone has a suggestion, much appreciation to you. It seems to be caused by the 'background:none;' declaration on the inner divs. (line 822 in your template.css) You use it to cancel out the box-tl.gif that is set on the direct parent of those divs, but somehow it causes problems. Setting any colour on that div fixes the problem, but of course it's a gradient behind it, so you can't have a solid colour. background:transparent; does not fix the problem. What does fix the problem, is setting a different background image on it, such as 'clear.gif', a simple small totally transparent image. I've seen this behaviour before in IE, where in some case you need to use a transparent background image to fix a layout or link clickability issue, but I have no clue whatsoever why. I just call it IE :-) -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Element alignment.
bruce.som...@web.de wrote: I would appreciate it, if someone would look at http://www.maireadnesbitt.com/initial.html The page has three columns: leftcontent, centercontent and rightcontent. Why does the centercontent not begin at the top of the window? Because of there being 'things' before the columns inside the body element. centercontent has no top margin, while rightcontent has a top margin of 25 px. Why do they line up vertically, nonetheless? The top margin of the right content is overlapping the space that is caused by said 'things'. There are 3 characters,  , at the top left of the window, whose origin escapes me. They are not found anywhere in the HTML-file. Has anyone seen such an occurence? That is something called UTF-8 BOM. Your editor puts it in there I think. Choose an editor that doesn't add it, or one where you can choose to add or not add it. Personally I use TextPad (only on Windows), which has a tickbox for it, which I untick. The second thing that probably takes up space above your columns, is your style element. This belongs inside the head of your document, not in the body. Thanks for any tips. You're welcome :-) -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Element alignment.
bruce.som...@web.de wrote on Friday, March 6, 2009: Von: Els el...@tiscali.nl bruce.som...@web.de wrote: http://www.maireadnesbitt.com/initial.html The page has three columns: leftcontent, centercontent and rightcontent. Why does the centercontent not begin at the top of the window? Because of there being 'things' before the columns inside the body element. centercontent has no top margin, while rightcontent has a top margin of 25 px. Why do they line up vertically, nonetheless? The top margin of the right content is overlapping the space that is caused by said 'things'. There are 3 characters,  , at the top left of the window, whose origin escapes me. They are not found anywhere in the HTML-file. Has anyone seen such an occurence? That is something called UTF-8 BOM. Your editor puts it in there I think. Choose an editor that doesn't add it, or one where you can choose to add or not add it. Personally I use TextPad (only on Windows), which has a tickbox for it, which I untick. The second thing that probably takes up space above your columns, is your style element. This belongs inside the head of your document, not in the body. What sort of 'things' can be within the body-element before the columms? From where? Thing 1: the UTF-8 BOM Thing 2: the style element. The style-element IS contained within the head-element: head ... style ... /style ... /head ... body ... Firebug showed me the style element as first element inside body, right after the UTF-8 BOM. I didn't realise that this is probably caused by this very UTF-8 BOM, which I now see via view source, is before the doctype, and not inside body like Firebug showed. I wonder why a BOM is being inserted with text/html; charset=us-ascii . I have no idea about that, sorry. Just open the file in a different text editor than before, save it, re-upload, and check if it's gone. -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problem with extra white space appearing
Joe Polk wrote:
Thanks in advance for your consideration and help regarding this
issue. I helped my client purchase and implement a web site
template for their new business. Unfortunately, there is a problem
with part of the CSS which pushes out the content area of the
site past the width that it is supposed to go.
The web site is under development at http://www159.pair.com/ngllc/
As you will see, there is extra white space that pushes out the
content of every page. I've taken a look at the CSS and noticed
that if I remove the background:#fff; from this -- .content{
width:700px;background:#fff;} -- the proper width is maintained but
i have a completely black background for the content area. This
pushing happens regardless of any color that I use.
No, the proper width is not maintained if you take off the background
colour. It is just not visible that it sticks out then.
Also, this problem doesn't happen in Firefox, but only in IE.
Does anyone know how I can modify the stylesheet so that I can have
the white background in the content area, but have it not push out?
I don't have time to take a copy to test locally, but my guess is that
if you take out the first line at the top of the document, the ?xml
line, thins might just fall back into place for IE. Anything that
comes before the doctype, throws IE into quirksmode, where it
calculates margins and widths entirely different than in standards
mode.
Another thing I found: the td that holds the content, has a width
set of 640px. Yet, inside it, is another table with 3 tds, with a
width of 241px each.
That just cannot officially fit :-)
--
Els
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Space beneath flash player
Thom Brown wrote: I've got a problem with a mystery space beneath a flash player I show on my site. If you go to http://www.killingcupid.co.uk/music/ and click on the only available flash link on that page (for the track Broken Mind), the player should appear and you'll see, at least in Firefox, a space underneath. I've tried getting rid of this but have been unsuccessful so far. Ideally the player would not increase nor decrease the size of the row, and would be centered vertically so it would probably have even spacing either side. Anyone got any ideas? The player itself is 20px high, so in my Firefox with my settings, this already makes the row higher. But to get rid of the extra space below, you can add 'vertical-align:bottom;' or 'display:block;' to the styles for the embed element. The space is what you see on any inline element, room for the descenders of g,j,p,q,y. -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Is a missing ; OK?
Ian Piper wrote: I had always thought that the terminating ; was mandatory. Can someone advise me? It is not mandatory on the last rule in a set, but it is on the other ones, needed as separation between rules. It is advisable to use them on all of them though, so that if you add another one after the last one, you don't forget to add the ; on what is now the second last one in the set. -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Stack level in IE (problem with position:absolute andz-index)
Francois Jordaan wrote: This IE quirk seems to catch me on nearly every project: http://paper.isotoma.com/examples/_test-position.html It comes down to the stacking model. All I remember from last time I struggled with this is it's well-nigh impossible to work around. I really, really want Item 3 to be above Item 2, but Item 2 *must* be position:relative. Anyone have a quick suggestion, something I might be missing? If you give Item 2 z-index:-1, it looks like it works. Not tested for possible side-effects when more content is involved. -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] First element of list hiding for some reason
JR Heard wrote: Anyone have any idea what's going on? Does this show up in your FF3 as well? (The first image should say Adbrite, as AdEngage is actually the second image in the list.) You have a URL? ;-) -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] First element of list hiding for some reason
JR Heard wrote: [ http://jrheard.com/orl/index.php/anchor/resources/category/customers_partners/ ] The image contained by the first li of the ul under customers is having style='display:none;' applied to it in FF3, according to Firebug. Doesn't show up like that in the source, can't reproduce this problem in IE7, and I can't find any CSS or JS that would be targeting the display attribute of the image contained by the first element of the first list. Markup validates as XHTML 1.0 Strict. Anyone have any idea what's going on? Does this show up in your FF3 as well? (The first image should say Adbrite, as AdEngage is actually the second image in the list.) In my FF3 that's what's there, exactly the same as in IE7. In FF3 on Mac the same, no problems. AdBrite logo is there in all of them. Sometimes Firebug plays up - have you tried closing Firebug, refreshing the page, and then opening Firebug again? -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] First element of list hiding for some reason
JR Heard wrote: AdBrite seems to want to hide from me. Ah well, such mysteries are par for the course in the life of a web developer. Thanks again for your time! Just one more thought - haven't you accidentally blocked it with adblock or something? one click sometimes is enough. I just tested what happens if I adblock an image, and Firebug then gives display:none for the element.style. -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Font-color issue
Els wrote:
Ib Jensen wrote:
Link: http://ikjensen.dk/test/
It's not the colour, it's the size. Up the size a bit, and the blur
will disappear. If you look at the body text, that's also smaller in
IE than in FF.
Just noticed you have this in your layout.css stylesheet:
html body{font-size:12px;}
IE6 doesn't pick that up, and it makes all the difference. If you take
that line out, FF also makes the text smaller and blurs that bit under
'Note'.
I'd take that line out, and up the main text from 80% to 100% in your
basis.css stylesheet.
--
Els
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Png and good ol' IE6
Ian Young wrote:
This an old chestnut, I know, but I have tried several fixes to
make the png work on IE6 and it doesn't.
Now I don't know whether this is due to the fact that I amusing IE6
along with IE7 but the filter is not working.
Quick test page at
http://www.iyesolutions.co.uk/templates/db-test/png-test.html
Can you have a look and see if works for you and if not any
suggestions?
It is not working in IE6 indeed.
Two things that may interfere: background setting, and path.
Try this:
#alImg1{
background-image:url(images/strapline-big-4.png);
_background:none;
_filter : progid:DXImageTransform.Microsoft.AlphaImageLoader(
src = '/templates/db-test/images/strapline-big-4.png',
sizingMethod = 'scale'
);
}
--
Els
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS3 selectors to filter out content style
Dylan Wilbanks wrote:
I thought that using the :not selector was the solution:
a:not([href*=flickr]):before {
content: [;
color: #000;
text-decoration: none;
}
a:not([href*=flickr]):after {
content: attr(href) ] ;
color: #000;
text-decoration: none;
}
But there are two obvious problems:
1. Anchor links are now getting generated brackets thrown around
them
2. If he switches away from Flickr or links to an image on a
non-Flickr, he has to add a new exception every time
I don't have a solution for the second problem, but wouldn't the first
be solved by overriding the earlier styles?
a:([href*=flickr]):before {
content: ;
color: #000;
text-decoration: none;
}
a:([href*=flickr]):after {
content: attr(href) ;
color: #000;
text-decoration: none;
}
--
Els
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Mysterious Padding Appearing
christi...@netscape.net wrote on Wednesday, January 28, 2009: Can anyone figure out why there is left padding appearing on the H1 of this page: http://www.usmexfood.com/ Firebug isn't helping (it shows no padding on the element coming from any style). Adding a border to the H1 shows that the lettering does not hit the left edge. You mean that one pixels space? That's just the font that has some tiny space around the letter. If you change the font to Times New Roman for example, it does touch the border. -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problem with table in a div
Sarah Atkinson wrote: I have a table in a div. it¹s a pretty simple table it¹s the same no cell spacing... Just plain reg tabular data. But it fills the whole width of the div. however since both the td and the div have 1 pix table borders, it appears to have a 2px border around the table. Any suggestions? Take the border off the div? -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problem with table in a div
Sarah Atkinson wrote: I have a table in a div. it¹s a pretty simple table it¹s the same no cell spacing... Just plain reg tabular data. But it fills the whole width of the div. however since both the td and the div have 1 pix table borders, it appears to have a 2px border around the table. Any suggestions? On 1/27/09 1:18 PM, Kevin Rodenhofer ke...@rodenhofer.com wrote: Why not remove the border on the div? There is more to the div then the table. The div is more like a window with the table and other stuff about the data in the table. You could set a padding on the div so that there's space between the table and the div's border. -- Els __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Sliding doors - current
Eoin Maguire wrote: Hi, I've successfully implemented a version of the sliding doors technique and am now looking to add a 'current' selection that'll highlight the current tab you're on. I've looked on A List Apart and have tried their suggested code (setting the background position, as per the hover state) but it doesn't seem to work. Has anyone successfully got a 'current' state to work with sliding doors? If so, how? Just by adding the selector for the current class to the selectors for the hover state rules. Be aware of specificity though - if you've set a:link and a:visited to a certain style, you'll also need a.current:link and a.current:visited instead of just a.current to overrule it. -- 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] list line wrap
xhu1 wrote: Hi, I am using li with a bull; in the bengining of each line of text. How can I make sure if the line is too long, after the line wrap the second line stays behind the bullet, not under the bullet? Give the li a left-padding of the desired width, and then negative indent of the same width. This assumes you know the exact width of the bull; plus space though. Why not make the bull; an image and apply it in CSS by list-style-image:url(bullet.jpg); ? -- 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] how to use a class in a class
xhu1 wrote:
Hi,
I have a class defiend for form input label calles
.formfieldtext. Now I use table to layout the whole
user input form. I added:
.td1_1 {width:150px; height:20px}
How can I use .formfieldtext in .td1_1 so that there
is no repeat.
I think you are looking for
.td1_1 .formfieldtext{}
which will target any element with class 'formfieldtext' which is
inside any element with class 'td1_1'.
Also how can I add colspan in the .td1_1?
Via CSS? Not possible.
--
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] CSS Tooltips
Scott Wilcox wrote:
I know IE has issues with :hover on anything but a elements,
but using the following snippet:
a.info {
position: relative;
z-index: 20;
text-decoration: none;
}
a.info:hover {
z-index: 25;
}
a.info span{
display: none;
}
a.info:hover span {
display: block;
position: absolute;
top:2em; left:2em; width:18em;
border: 1px solid #0cf;
background-color: #cff; color:#000;
text-align: left;
padding: 3px;
}
I would assume that because its being used on an a element,
it would of worked. The aim if to provide CSS'd 'tooltips' as
such.
Any ideas?
IE needs a trigger on the :hover to see the :hover span, and I'm
not sure if a change in z-index does it.
Does it work if you add a.info:hover{background-position:0 0;} ?
If not, could you provide an uploaded example of the problem?
--
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] wrapping
Paul Collins wrote: Pretty basic question: if you had an image floating right and a paragraph of text floating left, what's the best way to stop the text wrapping if it exceeds the height of the image? Can you do this without adding extra text? img src=image.gif alt= width=1 height=1 border=0 style=float:left; p style=float:right your text here /p Just don't float the paragraph. -- 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] span/span image layover making links not work
Magenta Placenta wrote:
http://www.matthickerson.com/recent/barley/
http://www.matthickerson.com/recent/barley/stylesheet.css
In Firefox and Opera, the latest news links don't work, but
they do in IE
6. What I'm doing is displaying the text, then overlaying a
header graphic of that text:
div id=home_latestnews
h2span/spanLatest News/h2
div#home_latestnews h2 span
{
background:url(images/home_latestnews.gif) no-repeat;
position:absolute;
width:100%;
height:100%;
}
When I take out the span tag, the links work, so that's the
problem, anyone know why and how to fix without just removing
the spans?
It's the width:100%; and height:100%.
Give that span a border (or take out the no-repeat on the image)
and you'll see the problem.
--
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] IE Whitespace to right of absolutely positioned div
Tom Livingston wrote: On 7/26/06, Peter [EMAIL PROTECTED] wrote: I have a site where I've stripped out truckload of tables and even tried to protect again some font size variation. It looks good (i.e. works) in FF 1.5 and Opera 9, but hey ho, there's a 2px wide gap in IE. Here's a link to a simplified version www.kuroi.co.uk/testing/ITC. If anybody can tell me what's going on and how I can prevent this, I'd be eternally grateful. just a guess. No time to peek. http://www.positioniseverything.net/explorer/threepxtest.html Nope - it's only 1px, and it's a gap between a relative positioned parent, and an absolute positioned child. It only happens when the absolute positioned child has a right value (of 0). When positioning it to the left, there is no 1px gap. Haven't seen it before myself, but it seems to be a rounding problem. If you give the parent a width in pixels, the gap disappears. If you leave the width on auto or a percentage, dragging the window's side to the left pixel by pixel, will see the gap play hide and seek. Workaround for your page: give #searchBar a right value of -1px. The 1px you lose in the other browsers will go unnoticed. -- 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] Left Vertical Menu Updates Right Column Content...
Spencer Ivery wrote: CSS List: When using frames I can use a vertical menu list in the left-frame that will display content in the right-frame using HTML href. How can do the same thing with CSS without using the HTML href call? You can't. What you do, is include the navigation into every page (eliminate the frames), and just change the entire page on clicking one of the links. This is not CSS though, but HTML with either pre-processing or serverside script. http://allmyfaqs.net/faq.pl?Include_one_file_in_another -- 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] IE page is too long and produces vertical scroll bar
Christian G wrote: The page in question renders fine in Firefox 1.5, Safari and Opera 9 which display no vertical scroll bar, however IE renders the page longer than it should and produces a vertical scroll bar. I have no idea what's causing the problem in IE, or how to fix it, hopefully somebody out there can advise, HTML with CSS is as follows: [snip] td style= height:100%;main/td It would be easier if you'd show a URL, but my guess is that since that td is taking up 100% height, the rest of the page has no other option than to extend beyond the viewport. -- 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] Site Check (Delos)
[EMAIL PROTECTED] wrote: Could you fine folks check out a page on my site? It seems to work fine on IE 6 running on WinXP and in Opera 9 on my Mac. I'm experimenting a little bit and I can only imagine how it might be getting mangled in various browsers. =) The page is found at http://www.artpatient.com/comic.html and it's supposed to look like this screenshot. (http://www.artpatient.com/comic/scrensht.gif) That link is redirecting to the main page - I suppose you meant the .jpg ;-) Comparing to the jpg, it's almost working correctly in FF and IE7, both on Vista. The only difference is that I see horizontal scrollbars, while in your screenshot there are none. -- 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] making div as large as it needs to be
Marlene T. Yogerst wrote: [on problems caused by absolute positioning] It's nearly the same. I tried using relative positioning, but that put all the divs all over the page. I'm just not getting the relative positioning. I know, I need to study it more! No, relative positioning is not an alternative for absolute positioning. What you need to start with, is no positioning at all. Then you will see that divs grow when they have more content. Then, you may want to bring some structure into the page, by floating a few elements. And then... you will run into things you want and ask here, and then we'll most likely have answers that are easy to understand and implement :-) Just remember: don't use absolute or relative positioning, until you've mastered normal styles and floats and clears. I also don't understand why absolute positioning is fragile. Because it leaves no room for movement in the page. It seems pretty cut and dried to me and I haven't had problems with it on a different site I made. I'm curious to see that site - does it remain looking as it should in Firefox when you enlarge the font-size? Thanks again for your help. marlene (whose brain drain is still in effect) Depending on where you are, that could also be caused by the heat ;-) -- 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/ __ 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] making div as large as it needs to be
Marlene T. Yogerst wrote:
I'm having a brain drain and need some help. I have a div
that I want
to have automatically resize itself down the page as content
is added to it. I want to be able to continue to add
paragraphs or images in the
div and in doing so, have the content move down the page as
needed. I tried adding height: 100%; but that didn't work. I
am obviously doing something wrong, but I can't figure out
what it is. Here is the div so far;
.main_content {
background-color:#ff;
border: none;
position: absolute;
[snip]
Without adding height at all, the div should automagically
stretch to contain its content.
However, seeing as you are using position:absolute, I'm guessing
you gave other elements in the page position:absolute as well, so
that the stretched content div is probably being covered by for
example the footer.
If that is the case, the solution lies in not using
position:absolute for some or all of the elements in the page.
Impossible to tell without seeing the whole page though.
What is the url?
--
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] Duda validando CSS-HTML
aitiba wrote: Buenos dias, Estoy haciendo un web que esta alojada en http://copyhelp.iespana.es/ajax/. Es la primera vez que valido el CSS a una web (tambien cuando lo haga sera la primera vez que valide HTML). Lo he pasado y he conseguido solucionar todos los errores que me ha dado pero me queda un pregunta: 1.- ¿no hay ningun validador de CSS donde tu le metas el dominio y el mire los CSS que tenga y te diga los errores que tienen? * Si, hay: http://jigsaw.w3.org/css-validator/validator-uri.html * 2.- ¿es mejor pasar el validado de CSS, el de HTML o da igual? Si el HTML es inválido, la validación del CSS no ayudará a conseguir exhibir sus páginas correctamente. ¿Usted habla inglés también? (Would be easier for more people to understand your questions ;-)) -- 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] IE and simple clear method question
Tom Dell'Aringa wrote: Hi folks, I have a layout where I need to use a simple clear to open up a floated container in FireFox. I'm using a BR tag to do this. It works fine in FF, but the problem is in IE I get a line break (this is below a horizontal nav) that breaks the layout. So the question is, how can I clear the float in FF but not get the extra space in IE? By using a div with one space inside instead of a br, and give it height:0; and overflow:hidden;. -- 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] Best CSS Online Validator
Brian Cummiskey wrote: On 7/13/06, Marje Cannon [EMAIL PROTECTED] wrote: What's the best free online validator. The one at W3C throws up errors that are not errors. the w3 one is THE validator. That does not mean it's always correct. I continually get an error for specifying line-height this way: line-height: 2; 2 WHAT? you need a unit, px, em, %, etc No, you don't. Line-height can be in number, length, or percentage. Number is without unit: http://www.w3.org/TR/CSS21/visudet.html#propdef-line-height and it keeps telling me that color: transparent is invalid I think that's a warning though, not an error? A quite annoying warning though, and it would be good if there was an option to specify which warnings we're interested in, so these 'transparent warnings' could be omitted. -- 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] IE draws a random line through nav links issue
Brian Cummiskey wrote: When I met wth my client at their place the other day, I noticed for the first time a weird IE quirk. When scrolling occurs, sometimes the nav bars when you scroll back up will have a random 1px white line through them. I DON'T see it and HAVEN'T been able to reproduce this on my IE6/xp on my laptop, but I linked it to a buddy on the same setup who does see it. To reproduce: go to: http://www.mtcues.com/beta/category/testimonials/ (not limited to this page, just the longest one that should require scrolling on most normal resolutions) in ie6 scroll down so nav bars are out of view, scroll back up to top. repeat a couple times. a white line may appear. It might help if you stated on what kinda setup the problem does occur, so that anyone with that setup may check your page. FWIW, it's not happening on my XP/IE6 either. It sounds like a little peek-a-boo though. I'm guessing it has something to do with my a:hover thick bottom borders on the links, but I'm not certain. To be certain, take off those borders, and ask the same person if he still sees it :-) -- 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] IE6 problem with css dropdown menu
iris wrote:
i'm on the verge of a nervous breakdown and hope someone here
can solve this problem. this is my first attempt at css
dropdown menus (following instructions in 'more eric meyer on
css'). everything's just dandy in mozilla and opera but it
doesn't work in IE6. the weird thing is that it _does_ work
if i stick the css into the html file.
html file with internal css (which works in IE6):
http://jarmin.com/clients/genderwerk/template.html
html file with external css file (which doesn't work in IE6):
http://jarmin.com/clients/genderwerk/template-extcss.html
external css file:
http://jarmin.com/clients/genderwerk/css/dropdown.css
it gets weirder. there was a similar discussion recently
where the advice was to trigger the hover effect, by first
setting a style for the hover on the a itself, before IE
'sees' the hover style for the stuff inside of it. i fiddled
with that for a while but didn't get anywhere.
This isn't the same thing - IE doesn't support :hover on anything
else than a, and your li elements (obviously) aren't inside
a elements.
When I disable JavaScript, not even the first link above works. I
don't know where your script is, or what's in it. Perhaps it
contains an absolute url so that it works for your local file but
not for the uploaded one? Or it writes stuff that needs to be
together with the CSS styles, so there fore it needs to sit in
the html file together? I don't know any JavaScript anyway, but
the answer must be somewhere in there I suspect.
div#nav li:hover {
background: #d4eaae;
}
div#nav ul.level1 li.submenu:hover ul.level2 {
display : block;
width : 20em;
}
Yup, won't work on IE.
if i use the external css file but stick just these two
instructions into the html file it works locally on my
computer but as soon as i upload it to the remote site it
doesn't work anymore. when i noticed that, i gave up because
that just doesn't make any sense to me. why would it work
locally but not remotely?
Did you also upload the JavaScript?
--
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] Random Space
Richard Brown wrote: I am building a site here: http://www.weddingcompanycornwall.co.uk/ http://www.weddingcompanycornwall.co.uk/wp-content/themes/weddings/style.css However, I seem to have gained a random space in the content div. You can see it at the top of the scroll bar. Does anyone know where it comes from please? Yup. You placed the #content at 120px from the top, and gave the #header a height of 100px. There's 20px difference between those two values :-) -- 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] [QUESTION] Can't get my text to wrap part 2
Melissa Carraway wrote: My NEW issue is this: I have all of my elements nested within one main DIV called table01. My problem is that on pages with a lot of text, the outer DIV doesn't get taller to fit the copy. Instead it pokes out the bottom. Check it out here: http://www.decisiveelement.com/clients/ndcsite/HTML/about_overview.htm 404 -- 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] [QUESTION[ Mac Mozilla issues?
Melissa Carraway wrote: ugh... how frustrating - I've been working on this all week on a PC and it looked pretty much fine, except for the issues I mentioned earlier... This one has me baffled though. My images won't show up at all on the homepage when I view it on my mac at home. What is it doing differently? How should I change it? http://www.decisiveelement.com/clients/ndcsite/index.html http://www.decisiveelement.com/clients/ndcsite/images/sketch.jpg gives a 404. Did you upload your images? -- 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] centering entire content in IE
Simon Kerr wrote: Hi all. Does anyone know if there's a way to centralize an entire page's content in the browser using IE? I've tried margin:0 auto but no luck. http://locusmeus.com/html-css/centeringpage.html -- 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] centering entire content in IE
Dave Goodchild wrote:
#wrapper {
position: relative;
left: 50%;
margin-left: -370px;
width: 740px;
}
Meaning your page will start losing the left side on window
widths narrower than 740px. Haven't we been here before?
Yup, we have :-)
http://archivist.incutio.com/viewlist/css-discuss/75840
--
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] pure CSS popups not working in IE 6
Christian Montoya wrote: Hello list, I am currently trying to implement pure CSS popups[1] on a page, but they are not working in IE 6: http://temp.rdpdesign.com/example/example.html I tried some hasLayout triggers and changing the positioning of the nested span, but nothing worked. I really have no idea what's wrong, especially since the example by Eric Meyer [1] works just fine. The CSS is at: http://temp.rdpdesign.com/example/style.css The relevant CSS starts with #header #support Thanks in advance! [1] http://meyerweb.com/eric/css/edge/popups/demo.html Not tested on your example, but I think you need to trigger the hover effect, by first setting a style for the hover on the a itself, before IE 'sees' the hover style for the stuff inside of it. I recently wrote an explanation wrt borders on images on hover, but the same goes for a popup span: http://locusoptimus.com/css-trickery/ie-image-border-styles-on-hover.php -- 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] 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] Anomalous rendering with a links
Ian Young wrote: Good morning list, Almost afternoon :-) Here's an interesting one Have a links surrounded by a div. The first link looks as required all others do not if they have url defined eg a href=contact.html Contact/a wrong a href=contactContact/a correct!! More bizarrely on another server (the test bed) it works ok. Same page same style. How it should look: http://www.iyesolutions.co.uk/templates/vensite/links.html How it shouldn't: http://www.venachar-lochside.com/links.html In my Firefox, both links look exactly alike. In my IE6, the second link has a one character wide indent on the last link in the list. This is caused by lack of a closing /a on the link before the last. BTW - there are two sets of links on your page - one in the content, and one in the footer. Which one is causing you problems? In neither of the two sections I see an obvious difference in code between one version and the other, except for the missing /a and obvously the different paths to the images and stylesheet. Now, I have never come across this before and the div works everywhere else on the site. I don't see it not working. On a sidenote though: why don't you mark up those links as lists? They are lists of links, so why not use a list instead of a series of paragraphs? -- 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] Padding problem with tables to div conversion
Tom Anthony wrote: Here is the dummy page just to show the problem in its simplest form: http://www.tomanthony.co.uk/css_padding/ I want to adding 5px of padding to all the red boxes. I need the site to work in IE5.5/6, Safari, FF as a minimum. Just add the 5px padding to the red boxes, but take out the 100% width on them. Any suggestions for the neatest way to add the padding and/or otherwise tidy up (lose some 'inner' divs?) the layout would be really appreciated! That depends on what you want to do with this layout, but the way it looks right now, I wouldn't lose any inner divs. Not if you want the 5px padding on both the wrappers and the red boxes anyway. -- 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] setting default styles for DIV but still having it cascade
Simon Kittle wrote:
I can kinda get around this for my DIV elemnets by just
setting a default color attached to the BODY element. But the
trouble is this doesn't work for my TABLES, because TD
elements don't seem to take on the style from a BODY. So I
have to have a rule similar to:
td
{
color: blue;
}
But that then means if I have a table inside a DIV or some
other container which sets the color to red, I have to
manually set the color on each of the TD's inside that child
table as well as on the DIV container, which is not ideal.
What is the recommended way to solve this?
Use classes.
Instead of adding style=color:red; to a div, add
class=classname, and set in the stylesheet:
div.classname,
div.classname td{
color:red;
}
__
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] IE and border-style:groove
Peter L. Sc hlueter wrote:
I have a problem with a Very simple site.
http://www.undergroundrapcd.com . Simple one page, no
graphics, no floats, text only! But IE will not display the
{border-style: groove;} request. Firefox does. The site
validates for HTML and CSS. The CSS is as follows...
border-width: 1.5em;
border-style: groove;
border-color: #00;
You set black, and IE has trouble taking one darker and one
lighter colour from that.
If you would use #CC; for example, you'll see groove style
borders in IE too.
--
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] IE and border-style:groove
francky wrote:
Els wrote:
Peter L. Schlueter wrote:
But IE will not display the {border-style: groove;} request.
Firefox does.
You set black, and IE has trouble taking one darker and one
lighter colour from that.
If you would use #CC; for example, you'll see groove style
borders in IE too.
Yes, here a testpage
http://home.tiscali.nl/developerscorner/css-discuss/test-groove-a.htm.
(Eager to reply, I didn't notice Els already gave the answer.
;-) )
Yours is more complete though - I didn't compare FF and IE, and
also didn't notice IE uses the exact colour plus a darker one.
And I like the interactive switch on your 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/
Re: [css-d] IE and border-style:groove
francky wrote: [border-style:groove;] Thanks! In the meantime I prepared an alternative solution: play the border-colors round with a solid style and the half of the border-width in the #wrapper, and add an #inner-wrapper doing the same for the inside groovy colors. Then browsers (and IE) cannot run away! :-) So: new testpages http://home.tiscali.nl/developerscorner/css-discuss/test-groove-c.htm. Just switch the bottom and left inner/outer colours for the authentic groove style though! ;-) -- 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] Weird Firefox bug in a href
Carl Youngblood wrote: Doesn't work. The moment I remove display:table, whether or not I have width: 100%, the border and background image disappear. Ehm.. option 2 was meant to be used without option 1, not in addition to it. IOW: leave display:table in place, but add width:100%. -- 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] Interesting bug... vanishing links!
[EMAIL PROTECTED] wrote: I seem to have a bug with vanishing links. Nope, it is not a bug. Please have a look at http://www.wdam.co.uk/clients/dynam/hh/ If you look in IE, all the links (are you a, homeseeker, etc) work fine. If you look in Firefox, they all work fine on the front page. But if you click on homeseeker, the developer and landowner links stop working. Confirmed. On other pages, different links suffer! I can't see a pattern and nor can my programmer partner - we are both baffled! The links on the right are covered by the triangle. Set a border for #triangle in your stylesheet and you'll see it. The only reason that on the homepage the links still work, is that on that page, you have div#triangle *before* div#navlist, and as both have position:absolute, the one that's later in the source, will overlap the earlier one. -- 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] HR color
Ian Young wrote:
Having put color of HR into class as follows:
.hrcolor {color:#ff;}
and html as hr class=hrcolor /
renders ok in IE but not in FF.
If I use background:#ff; then FF renders darker color.
What say you for solution?
.hrcolor{
color:#ff; /* for IE */
background-color:#ff; /* for FF and Opera */
height:2px; /* for Opera */
border:none; /* to get rid of (dark) border in FF and Opera */
}
--
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] aligning a p tag with the top of a div in IE
Debbie Campbell wrote: I cannot figure out how to get the p tag to line up with the top of a particular div in IE6. It works fine in Firefox. You'll see the p tag in green, contained in a yellow div, near the bottom of this page: http://www.parallaxwebdesign.com/projects/parallax_r2/portfolio.php I know that vertical-align doesn't work with block elements - is there something else I can use? Give p.port-text a top margin of 0? -- 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] Mysterious Black Line
tedd wrote: Hi people: Hi person ;-) I'm not asking for anyone to root out a solution for me, unless you want. What I would like is IF anyone has seen this phenomena before and can point me in the right direction to find a solution. It has been pointed out to me that a Mysterious Black Line appears at the top left of my web page http://www.sperling.com/examples/menuh/ when viewing the page via Firefox 1.5.0.4 running on Mac OS X 10.4.6. Same here on Windows XP, Firefox 1.5.0.4. This line doesn't appear on any other browsers or OS that I am aware. But it does :-) So, anyone have any ideas as to why and can offer a direction for solution? The line is the top border of this element: a href=#narrowparagraphimg src=images/gifs/transparent.gif alt=Skip Navigation height=2 width=2/a Firefox doesn't obey set widths on images that don't load. The transparent.gif is not present in the given location. -- Elshttp://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] Mysterious Black Line
tedd wrote: The line is the top border of this element: a href=#narrowparagraphimg src=images/gifs/transparent.gif alt=Skip Navigation height=2 width=2/a Which carries the image border thing problem. I placed that there for accessibility Skip Navigation, which as my Mom used to say No good deed ever goes unpunished. I place skip links outside of the viewport, and then let them 'pop up' inside the viewport when receiving focus, with :focus and :active (for IE) styles. Why does the background image I use not work in just the those two pages showing my menu examples -- http://www.sperling.com/examples/menuh/ http://www.sperling.com/examples/menuv/ -- via Firefox 1.5.0.4 running on Mac OS X 10.4.6 and I assume others? I've looked at it and the problem isn't obvious to me as to why it's happening. Is it the IE conditional statement interfering with the basic css with regard to background? You can test that of course, by taking out that statement and check if the problem persists in FF. Which background-image are you referring to? I don't see anything in IE(7) that isn't there in Firefox, except for quite a few problems with overlapping texts in the content (on all pages). Opera also shows me the same thing as Firefox. -- 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] Weird Firefox bug in a href
Carl Youngblood wrote: On 6/19/06, Carl Youngblood [EMAIL PROTECTED] wrote: I'm having a strange problem where clicking on an ordinary a href link is not loading the page it points to properly in Firefox. Instead, it is just jumbling up the placement of the page but not sending another http request to the server. Please check this out: http://constructioncapitalsource.com/test/sample.html Really weird. Any ideas? One more detail: apparently the bug doesn't occur on the links at the top-right of the page--just on the links that are below the horizontal menu. Hi, You gave #container display:table;. You've also set the width of the floated children to resp. 70% and 29.5%. This is a percentage of their parent's width, but since the parent has display:table, it shrink-wraps around the children. Vicious cycle :-) No idea whatsoever why clicking the links triggers the #container collapsing, but if you either take off display:table, or add a set width to #container, nothing collapses, so the links don't disappear from under your mouse half way clicking them (which is why it seems like they're not working). -- 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] Weird Firefox bug in a href
Carl Youngblood wrote: On 6/19/06, Els [EMAIL PROTECTED] wrote: On 6/19/06, Carl Youngblood [EMAIL PROTECTED] wrote: http://constructioncapitalsource.com/test/sample.html [snip] if you either take off display:table, or add a set width to #container, nothing collapses, When I remove the display:table, my pixel borders disappear. Do you have any idea about how I can keep those borders but get rid of the other unwanted properties? I'd like this div to expand as the width of the browser expands. Yup, use option number 2: add a set width to #container: width:100%; -- 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] Background Image on Blockquote Hidden Under Floated Image
Duckworth, Nigel wrote: Greetings All, Hi, I'm working on a page which contains posts with an author image floated left, the text of the post down the right and wraps around the image. A problem occurs when there are blockquotes in the post. The blockquote has a background image quote mark and it disappears under the floated image. A similar thing is happening with DIV.hb, it's background image disappears but only in Firefox. Some posts will have the floated image while others will not, so I have to take into account both scenarios. [snip] Markup with CSS here: http://newcleardesigns.com/lab/ If you give blockquote overflow:hidden or overflow:auto, the problem is solved in Firefox and Opera. If you give blockquote a height, the problem is solved in IE. Use hacks to hide the overflow from IE and the height from Firefox :-) Tested only in IE6, Opera 8.54 and FF1.5. -- 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] Background Image on Blockquote Hidden Under FloatedImage
Duckworth, Nigel wrote: Els, Fantastic, thank you! I should have thought of trying overflow: hidden, I tried everything and the kitchen sink but that. This would be ideal since I don't have to change the markup (which I don't have control of). Looking at it again later today, I found that if you replace the height with zoom:1, you won't need hacks to hide anything. Overflow:hidden or auto doesn't interfere with zoom:1 like it does with height :-) -- 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] minor IE hover problem
Andy Mosmiller wrote: I coded this page a while ago and thought I had the small pictures with the borders hovering properly in IE, but checking today I find I am mistaken. http://www.kipke.com/events.html http://www.kipke.com/kipke.css http://www.kipke.com/kipkeIE.css As you may notice, the border color does change on an actual mouse click, but not on a regular mouseover. I also tested things out by removing the a:focus img and a:active img options, leaving only a:hover img with exactly the same results as having all three in place. I figure my usage is not the same as the well documented IE issue regarding applying the hover pseudo-class to non-anchor elements. Shouldn't this work? Should: yes. Would: no, because it's IE ;-) IE needs a trigger. If you set a colour effect on hover for links earlier in the stylesheet, the styles for the images will work too. In your stylesheet, you set the colour for links as #E1112B. If you would add 'color:#E1112B;' to the styles for a:hover, nothing will change. But if you make it #E1112C (so that the hover colour is - even very minimally - different from the link/visited colour), the hover styles you set for the images will work too. -- 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] Centering a CSS positioned design
[EMAIL PROTECTED] wrote: On Fri, Jun 16, 2006 at 12:16:03PM +0100, [EMAIL PROTECTED] wrote: Ok, I've tried that. I've also used the container to give a background colour of white for the content area, where the main body background will be grey. This hasn't been entirely successful; I guess I have to set a fixed height, as not setting one meant the white background wasn't seen, and setting 100% as I have at present isn't really what I want? Indeed. Setting 100% height causes the background to stop when you need to scroll up to see more text (which happens on smaller windows and with enlarged text. This is still an issue for me. How did you colour your page before it was centered? The problem with absolute positioning, is that you are taking the elements out of the normal flow, thus leaving its parent virtually empty. And an empty container doesn't gain any height. I could define 4 container classes, one for each page, and set it to the appropriate height for that page, but this isn't really a fix. Especially since the text will then 'fall out' of the bottom on enlarging the font-size. I've done lots of googling but I must be going wrong somehow because I can't find a way to get the container to be at least the length of the longest bit within it, but no longer. It would do that automagically if it weren't for the absolute positioning. Site is http://www.wdam.co.uk/clients/dynam/hh/ The other issues were caused by me being a complete lemon and forgetting to add a CENTER tag in an important place, so please ignore them! Sorry, I'm not entirely well and it's been a long week! shudderCENTER tags??/shudder (I'll ignore that bit too! ;-) ) -- 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] Centering a CSS positioned design
[EMAIL PROTECTED] wrote: [extend background colour to bottom of page] It would do that automagically if it weren't for the absolute positioning. Yep. So is my choice just to reposition everything with relative positioning? To give an element position:relative, means to give it a position *relative to its own original position*. Say you have an h1 and a paragraph below it. If you would give the h1 position:relative with a top value of 3em, it would be covering the paragraph below it. And then to go into layers rather than divs? I don't know what you mean by that. Aren't divs layers in Dreamweaver speak? (I don't know Dreamweaver, but that's what I heard) Site is http://www.wdam.co.uk/clients/dynam/hh/ shudderCENTER tags??/shudder (I'll ignore that bit too! ;-) ) Probably best ;) I'll tidy up after I've got it looking right and there are no changes from the client :) First get the code done correctly, and then make it look right. The reverse will give you headaches. Thanks, it's much appreciated! You're welcome :-) -- 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] CSS Base url for image property values?
Stephen Cunliffe wrote:
Suppose a site has the following structure:
www
\things
\stuff
\other
\neat
\cool
In the ideal scenario, I'd like to reference one css file
site.css that sits in the root directory.
This works fine, and it will work if I link it in any page,
nested anywhere in the site but
if one of the styles, has something like:
div.foo{
background-image: url(pic.png);
}
Then it only works, when loaded from the root directory...
Because that's where the css file is.
So, the question is, outside of defining several duplicate css
files (with different paths), or copying the images (there
would likely be a few), to each and every directory, is there
a way around this?
Not sure if I understand the question correctly.
Images that are defined in the css file, have to be relative to
that css file.
If your CSS file is in /foo/bar, and your images are in
/foo/images, you reference them from your stylesheet as
url(../images/pic.png); or url(/foo/images/pic.png);, regardless
of where the html files are that the stylesheet is applied to.
No need to copy images into various directories, they can all
stay together in one place, just like the CSS file.
--
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] Hyphens in class names
Denise wrote: First post to the list ... I've been pulling my hair out trying to get a simple div of menu links to center on a page using class=Adm-Menu. On a lark, I removed the hyphen from the name and poof all was well. I found it odd that a hyphenated class name applied to h1 worked fine, but not for a hyphenated name on a div. While I think it's easier to just avoid hyphens, the team I'm developing with is using them extensively in CSS naming conventions. Yup, me too. Work with hyphenated classnames on a daily basis. Does anyone have a resource for which elements are adversely affected by hyphens in the name. Does this apply to id's also? Do you have an example of that problem? I never encountered it. I think it's possible that you had the Adm-Menu styles overridden by accident, or maybe there was another mistake somewhere? -- 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] Centering a CSS positioned design
[EMAIL PROTECTED] wrote: Having spent ages learning how to position stuff in CSS and getting it meticulously right (using the nice hack that I was pointed at to get IE to behave, too) the client has now said Oh, can you make the content centre in the browser? ARGH! If I was still using tables for layout this would be trivial but I am using absolutely positioned stuff. So... My idea is to make a container class for it all, and then to have everything positioned relative rather than absolute. And centre the containing class. Just make a div with id=container to hold all that's inside body now, give it position:relative, and all that was previously absolute positioned to the viewport, will now be relative to the container. (no need to change any of the absolute values you already set) Then you center the container by giving it a width and margin:auto;. -- 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] Centering a CSS positioned design
Dave Goodchild wrote:
To centre in the browser there are two main ways, either use
the IE heck (text-align: center then text-align: left etc)
but I prefer using relative positioning and negative margins
- example:
#wrapper {
width: 740px;
position: relative;
left: 50%;
margin-left: -370px;
}
which is not a hack.
Not a hack, but you're losing content on browser window widths
narrower than 740px.
What you call an IE hack above, is only needed for IE5. Other
browsers, including IE6, understand margin:auto;.
Given a choice between a hack and inaccessibility of content,
I'll choose the hack anytime.
--
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] Centering a CSS positioned design
Scott Reston wrote: I'm wondering - wouldn't it work to simply set the width of the body appropriately, then set it's left and right margins to auto? And give it position:relative, yes :-) Same effect without any extra non-semantic cruft. This just off the top of my head, so YMMV. Yup, good idea. I'm just so used to having a wrapper, that I forgot to think of that option. At the same time though, ISTR that there is/was a browser that didn't work with that. IE6, Firefox and Opera do though, so I'm not sure if I'm mistaken in my memory. Sidenote to styling body: if you don't want the rest of the page to have the same background as body, you need to style html separately. -- 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] Displaying external page in a div
John Mandia wrote: Is it at all possible to display a page within a page (i.e. not using frames or iframe). i.e. the ability to set the source of a div to an external url. Not with CSS. JavaScript perhaps (no idea) or else, Google for screenscraping (server-side scripting needed). -- 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] List Problem
Trey Copeland wrote: www.wku.edu/icap is what I'm working on. In firefox the related links line up perfect, but in IE they look horrible. Any suggestions? They don't line up in Firefox here, while they do in IE. You're missing an opening li on the second link. -- 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] List Problem
Els wrote: Trey Copeland wrote: www.wku.edu/icap is what I'm working on. In firefox the related links line up perfect, but in IE they look horrible. Any suggestions? They don't line up in Firefox here, while they do in IE. You're missing an opening li on the second link. Ugh - you're also missing opening ul and closing /ul. This tool may help: http://validator.w3.org/ After the code is valid, see if there are still problems. -- 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] List Problem
Trey Copeland wrote: General advice: When you are asking people to help you with a problem, don't alter the example. It's very hard to see a problem in a moving target. Instead, if you want to keep fiddling while waiting for other people's help, use a separate example. One that you post here, and another for yourself. I just looked again at your page, and now you've taken out the entire li structure. -- 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] Container Div Element Drop Shadow Effect
TMH Design wrote: Can (was) CSS used to give this page's containing element the drop shadow appearance? http://www.clubcorp.com/clubs.aspx Left and right shadow are one image: http://www.clubcorp.com/images/shadowBg.png It's set through the home.css stylesheet. -- 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] Class not activating color aspects
Scott Haneda wrote:
Can someone help me with this one:
ul id=navlist
lia href=/index.wsHome/a/li |
lia href=/who/index.wsWho are we?/a/li |
lia href=/why/index.wsWhy Us?/a/li |
lia href=/approach/index.wsOur Approach/a/li |
lia href=/clients/index.ws
class='selected'Clients/a/li | lia
href=/talk/index.wsLets Talk/a/li /ul
a.selected {
color: red;
font-weight: bold;
}
I get the bold, but not the red
Since you're not giving the actual context of the snippet, I can
only guess:
You probably have set a colour for ul#navlist a, and to override
it with just a class, you'd have to add the parent's selector
too. IOW, the following will probably work:
#navlist a.selected {
color: red;
font-weight: bold;
}
If not, provide a url so we can look at the rest of the code.
--
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] IE bug I've never encountered. please help!
John Haas wrote: The site: http://qatotonetwork.newmbc.com The issue: All of the top parts of the sidebar blocks (which are actually h2 tags) are shifting leftwards about 100 pixels upon page load. It at first renders correctly, then quickly shifts to the left. I see what you're describing in my IE, but when I copy your code locally, and view it as a file (Windows file system), the effect is gone, and it gives me a warning that active content was blocked to protect me from possible intruders. So, I'd say the culprit is somewhere in your scripts. The odd part: When I turn on Show Ruler on the MSIE Dev ToolBar, the issue corrects itself. Show Ruler probably also is a script, which in this case counters yours. If you can provide a static page with the output of the script in it, I could check the CSS and HTML to see why it happens. I don't read scripts though.. -- 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] Cleared div is affected by a float outside its ancestor tree
Charles Blaquière wrote: I'm creating a 2-column layout with a floated left column. The right column may wind up containing both left and right floats, so I'll need to use clear:both on some of its elements at some point. Unfortunately, the cleared element gets pushed below the bottom of the *left* column, even though it is not a child of that column. Is there something I can do to prevent the left column from affecting children of the right column? Yes. You can float the right column too. Clearing within floated elements doesn't effect/isn't effected by floats outside of it. The problem you'll run into though, is floating a flexible width div element. I found a way to do that, with nested divs. I have a content div, flexible width, (width:100% for IE5, width:auto for IE6), a floated div inside of it (width:100% needed for IE6), and then another nested div inside, to be able to set paddings (with a border-top and background-color explicitly set to get rid of IE5 bugs). You could also work around this problem though, by not using clear property at all in the right hand column, and use minimum heights instead. Like in your case, wrap the image in a div, put any text that needs to go to the left of the image in the div too, and set a min-height on the div, the same height as the picture. -- 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] Layout help: something like float:center?
Francois Jordaan wrote: Hi guys, How would you achieve this layout? +-+ +-+ +-+ | | | | | | | | | | | | +-+ +-+ +-+ Line1Line1Line1 Line2Line2Line2 http://locusmeus.com/test/thumbswithcaptionslistcentered.html http://locusmeus.com/test/thumbswithcaptionslistcenteredcombo.html (first one separates thumb and caption links, second one combines them into one link) Any number of (image + two-line caption) horizontally centered within a full-width container with a line top and bottom. Some more details: - Captions are short and have predictable lengths, so each (image + two-line caption) can have a fixed width. - Images are consistent in size (32 x 32px). - If there are too many (image + two-line caption) units to fit within the container, they should wrap to a second line of (image + two-line caption) units within the container. - Several of these containers as sketched above should be able to stack vertically. I think the above link covers all that. I guess it's a float: center equivalent I'm looking for. It's called display:inline ;-) -- 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] floats making rows, not columns.
nooluyo? wrote: understood, it's working right now. but the problem is: how can i tell the width should be 100%-250px. :) because left column should be 250 px. and right column should be whatever there's left screen space. Don't float the right column, just give it a margin-left of 250px. -- 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] Empty space in image gallery.
Erik Gyepes wrote: Look: http://www.pripisa.sk/ubytovanie/penzion-zeleny-dom--rajecke-teplice-18/ Why is there this empty space in the gallery? I don't see an empty space - I see 10 thumbnails with space between them - should I see something different? -- 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] floats making rows, not columns.
nooluyo? wrote:
This page should be something like this:
Featured MagazinesMust Read
Headline
but everything keeps going under Featured Magazines Section.
You can see by yourself @
http://www.alpalp.com/css3/tablecss.html
what is wrong; i've already gave magazines-home float:left and
mustread
float:left, so they should be columns, not rows.
I see 3 rows of 2 magazines, and then the div.mustread below
them.
.mustread{
float:left;
width:100%;
If you want div.mustread to be next to div.magazines-home, you
need to take off the 100% width on div.mustread.
--
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] Wrapping in thumbnail gallery
Lassi Heikkinen wrote: I found a nice CSS thumbnail gallery which I have converted to own styles: http://www.pulu.org/temp/cssgal/thumbgal.html The rows are sorted according to window's size, so by resizing the window the images are changing rows. What I want is that each row should always contain same number of images (excluding the last one) in all situations. For example in my current setup I have 5 images in the first row, 2 in the second, 5 in the third, 1 in the fourth and 1 in the fifth. When it should be 5-5-4. The width will be static and height varies. You'll have to prevent the height from varying. Give them a height in ems and experiment with different font-size settings in the browser to find the best height. As soon as the heights differ (even 1px), the stacking will be troubled and you won't have your desired layout. clear: both; after each row would be a semi-good solution but then I would lose the flexibility. Indeed, that's not an option then. -- 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/
