[css-d] Multispan column
Hi! Sorry for posting this again, but I can't find it have been delivered, thats why I repost. I trying to make a new website for our dogtrainingclub and want 3 column layout with columnspoan. Like this http://www2.tyresobk.se/bilder/tyresobk/blocks.png Anyone knows examples to point me in right directions? My own try didn't work out if right column became longer than the right http://www2.tyresobk.se/block.html (validated xhtml/css) regards Pelle __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] Hover issue
Also put the a.button:hover after the other a classes in the css.
Austin
- francky [EMAIL PROTECTED] wrote:
Kenoli Oleari schreef:
I have a hover style for links that are attached to text. I also
have some links that utilize images and want no hover effect in
these
cases. The class I give to the links with images is .button.
The following code does not work to stop the hover effect. How do I
do this?
a:hover.button { background-color: none; }
a:active { color: #339933; }
a:visited { color: #006633; }
a:hover {
color: #003366;
background-color: #00
}
Thanks,
--Kenoli
Hi Kenoli,
Did you try:
a.button:hover { background-color: none; }
or a simple (without a class for the img):
a:hover img { background-color: none; }
?
See also: SelectOracle
http://gallery.theopalgroup.com/selectoracle/
Success and greetings,
francky
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Styling legend in fieldset
From what I read, it is virtually impossible to acheive a decent crossbrowser result doing this. And Firefox seems to be the bad boy this time! I've been searching the forums and google, and this http://archivist.incutio.com/viewlist/css-discuss/11279 has been the best info I've found except for a bunch of how-to'es, none of which solves my spesific problem. The problem: I'm going for a header-looking label across the entire top of the fieldset. Would look like the red form-titles here http://www.malmoaviation.se/. And I'd prefer it to be fluid width, because there will always be changes. Thanks, Eystein. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] Styling legend in fieldset
I spent a bit of time on this and found a (sort of) solution...
legendspanLegend/span/legend
legend span {
display: block;
add styles...
}
Not ideal but it worked for me.
Austin
From what I read, it is virtually impossible to acheive a decent
crossbrowser result doing this. And Firefox seems to be the bad boy
this
time! I've been searching the forums and google, and this
http://archivist.incutio.com/viewlist/css-discuss/11279 has been the
best
info I've found except for a bunch of how-to'es, none of which solves
my
spesific problem.
The problem: I'm going for a header-looking label across the entire
top of
the fieldset. Would look like the red form-titles here
http://www.malmoaviation.se/. And I'd prefer it to be fluid width,
because
there will always be changes.
Thanks, Eystein.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] IE6 disapearing iframe bug?
This is my site: http://tinyurl.com/2rr88x Yes, I know there are other problems with it. The content in the middle is from a script, which I am pulling in via iframe. It works perfectly in IE7, and FF2, but in IE6, when you rollover any active element (e.g. hover links), all the content in the iframe disapears. Is this a known bug? If so is there a workaround? Or are iframes such a bad idea that I just need to code it differently? __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Multispam column
Hi! I trying to make a new website for our dogtrainingclub and want 3 column layout with columnspoan. Like this http://www2.tyresobk.se/bilder/tyresobk/blocks.png Anyone knows examples to point me in right directions? My own try didn't work out if right column became longer than the right http://www2.tyresobk.se/block.html regards Pelle __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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 with text-indent applied at the start of a page
Jukka K. Korpela wrote:
I was disappointed at seeing that IE 7 has preserved the bug that if you
set, say,
p { margin: 0; text-indent: 1em; }
to create literary paragraphs, the browser applies the indentation at
the start of every new page when the document is printed, even when the
first line of a page is not a first line of a paragraph.
I wonder if there is any known workaround.
No good idea. Maybe:
p { margin: 0; text-indent: 0; }
p:first-letter { padding-left: 1em; }
IE6 needs the blank before the left curly bracket after the :first-x
selector.
regards
Ingo
--
http://www.satzansatz.de/css.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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-d Digest, Vol 51, Issue 29
On Mon, 19 Feb 2007, Kor Dwarshuis wrote: When using... - - !--[if lte IE 6] - - ..which is, as far as I know, the correct syntax, the css-file is not applied to IE5.0, IE5.5 and IE6 The syntax is as described e.g. at http://www.quirksmode.org/css/condcom.html and it works for me (on IE6). So the question arises whether there is something special in your style sheet that causes the problem. Have you tested this with a very trivial style sheet that helps to see whether it is applied at all? I think a URL of a demo case would be important here. After removing the space between IE and 6 it suddenly works, but then IE7 seems to ONLY read 1 statement in the seperate css file (a height: 100% statement; which I know is a dangerous one) and applies it in a wrong way. That's rather strange, but I'd expect strange things to happen if you deviate from the common syntax, which has been defined (somewhat implicitly) by Microsoft: http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/overview/ccomment_ovw.asp -- Jukka Yucca Korpela, http://www.cs.tut.fi/~jkorpela/ Hi Yucca, I found the solution. It was due to the fact that I run multiple Internet Explorers on the same site.I found this here: http://www.quirksmode.org/css/condcom.html Note however, that if you use multiple Explorers on one computer, the conditional comments will render as if all these Explorer versions are the highest Explorer version available on your machine (usually Explorer 6.0). Thanks for your answer ~kor __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] Styling legend in fieldset
legendspanLegend/span/legend
legend span {
display: block;
add styles...
}
This doesn't work with width: 100% though, only fixed width.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Multispan column
Stib AB wrote:
I trying to make a new website for our dogtrainingclub and want 3
column layout with columnspoan. Like this
http://www2.tyresobk.se/bilder/tyresobk/blocks.png
Anyone knows examples to point me in right directions? My own try
didn't work out if right column became longer than the right
http://www2.tyresobk.se/block.html (validated xhtml/css)
For a start, try adding...
#wrapper2 {float: left; }
...to make the entire layout expand in height with amount of content.
You may also want to add...
#wrapper1 {margin: 0 auto;}
...to make the layout center in all browsers.
regards
Georg
--
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] fixed positioning problems in ie6 (and probably below)
Hi all, http://domain1255110.sites.fasthosts.com/uni/index4.html http://domain1255110.sites.fasthosts.com/uni/stylefile/stylenp.css The left hand column is supposed to be fixed in position as the user scrolls. I used this fixed navigation in a previous site and was not going to use it again - but after a client had seen it, they wanted it too and I was not there to say they couldn't. I know that there is a hack to help this but don't understand it when I read it. I want to start learning how and why I need to create these hacks so any useful links would be appreciated. So far I have found this; http://tagsoup.com/cookbook/css/fixed/ but the trouble being I don't really understand it - what it is telling me to do, how it works in my context etc. All help is much appreciated, Chris Christopher Blake [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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 Please
On 2/21/07, Nic Pulford [EMAIL PROTECTED] wrote: Thanks for the comments. The top header is a fixed and the text is meant to scroll under it. That it has a transparent edge is what is meant to make it different. Font size changes are targeted at the different sizes screens rather than different sized windows. If you get the size right for a 800x600 screen then when viewed on a 1600 x 1200 my poor eyes can hardly read it. Good thinking on the font sizes. I took another look at the site this morning, and I don't find the top image as odd as I found it last night. In fact, I quite like it. :) __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] fixed positioning problems in ie6 (and probably below)
Chris, AFAIK, there is no way to do this with CSS in IE 6 and below. There is a javascript solution at http://dean.edwards.name/IE7/ if that's an option for you. (Note: IE7 is, confusingly, the name of the script) Andy http://dean.edwards.name/IE7/ On 2/21/07, Christopher Blake [EMAIL PROTECTED] wrote: Hi all, http://domain1255110.sites.fasthosts.com/uni/index4.html http://domain1255110.sites.fasthosts.com/uni/stylefile/stylenp.css The left hand column is supposed to be fixed in position as the user scrolls. I used this fixed navigation in a previous site and was not going to use it again - but after a client had seen it, they wanted it too and I was not there to say they couldn't. I know that there is a hack to help this but don't understand it when I read it. I want to start learning how and why I need to create these hacks so any useful links would be appreciated. So far I have found this; http://tagsoup.com/cookbook/css/fixed/ but the trouble being I don't really understand it - what it is telling me to do, how it works in my context etc. All help is much appreciated, Chris Christopher Blake [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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 IE7 information -- 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] Multispan column
Hi georg.
Thanks for that tips.
I did figure it out after your mail.
at .clearer i removed clear:left and added float:left; which did the trick.
Regards Pelle
At 13:21 2007-02-21 +0100, Gunlaug Sørtun wrote:
Stib AB wrote:
I trying to make a new website for our dogtrainingclub and want 3
column layout with columnspoan. Like this
http://www2.tyresobk.se/bilder/tyresobk/blocks.png
Anyone knows examples to point me in right directions? My own try
didn't work out if right column became longer than the right
http://www2.tyresobk.se/block.html (validated xhtml/css)
For a start, try adding...
#wrapper2 {float: left; }
...to make the entire layout expand in height with amount of content.
You may also want to add...
#wrapper1 {margin: 0 auto;}
...to make the layout center in all browsers.
regards
Georg
--
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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
IE7 information -- 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] fixed positioning problems in ie6 (and probably below)
Christopher Blake wrote: http://domain1255110.sites.fasthosts.com/uni/index4.html I know that there is a hack to help this but don't understand it when I read it. I want to start learning how and why I need to create these hacks so any useful links would be appreciated. So far I have found this; http://tagsoup.com/cookbook/css/fixed/ but the trouble being I don't really understand it - what it is telling me to do, how it works in my context etc. A couple of alternatives: Ordinary CSS solution... http://www.gunlaug.no/contents/wd_additions_17.html ...which works more or less as the one you've found. IE-expressions... http://www.gunlaug.no/contents/wd_additions_15.html ...which works better IMO, but requires Javascript support in IE/win. Hope my descriptions are slightly easier to understand :-) regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] clear :after method
so im trying to analyze the :after method of clearing, kinda get
everything till I hit IE7.
..
/* targets standard compliant browsers: FF [and maybe IE7???, part of
my question coming up] */
.clearafter:after{ content: .; display: block; height: 0; clear:
both; visibility:hidden; }
/style
/* targets ALL IE's */
!--[if IE]
style
/* Following applies the rule to (ALL browsers INCLUDING
IE-MAC) then next 'hide' rule substracts (ALL browsers EXCLUDING
IE_MAC) hence following only IE-MAC should see after all is done */
.clearafter {display: inline-block; }
/* Hides from IE-MAC
IE-MS sees this and only IE version 7 apply * html
.clearafter
part for wanted 'incorrect clearing behavior' hasLayout produces in
those browsers.
IE7 doesnt see that rule, and still has inline-block so need
to
set it to soewmthign else with another rule (the rule after this one).
\*/
* html .clearafter {height: 1%;}
Now i would assume only IE 6 (aka only IE7) would see
following rule
.clearafter {display: block; }
/* End hide from IE-MAC */
/style
![endif]--
But on
http://www.blue-anvil.com/archives/experiments-with-floats-whats-the-best-method-of-clearance
, which is what i am basing my question on, he says
But, o no, IE7 wont clear the floats. This is due to the face IE7 has
dropped support for the pseudo :after class, and since the holy hack
doesn't target IE7 either, the box wont clear.
This is where the display property saves the day
This gives IE7's clearfix a 'display:inline-block', giving the
clearfix 'hasLayout', and then resets the display property inside the
hack for all the other IE versions, solving the error.
That doesnt make sense to me as I would think IE7 applies the after:
correctly since i beelive its supported, and needs its display reset
back to display:block; so that other general IE-MAC rule doesnt apply
to him.
But he makes it seem like it gets display:inline-block; applied which
causes hasLayout in him just like IE-MAC needs.
Am I wrong in IE7 applies the :after and gets reset to display:block?
or does the site word it wrong?
Thanks,
Arian
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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 with text-indent applied at the start of a page
On Wed, 21 Feb 2007, Ingo Chao wrote:
No good idea. Maybe:
p { margin: 0; text-indent: 0; }
p:first-letter { padding-left: 1em; }
I'd love to see your good ideas if you don't count this as good!
Looks like a perfect solution to me. Removes the problem both on IE 6 and
IE 7, and setting left padding for the first letter instead of text-indent
isn't even a hack, just an alternative (and perhaps more natural) way of
doing things.
In theory, the :first-letter pseudo-element is defined as referring to the
first _letter_, so one might be worried about the situation where a
paragraph starts with a non-letter character like a digit or parenthesis.
However, the CSS 2.1 draft (i.e., the thing closest to a de facto standard
we have) says: The ':first-letter' also applies if the first letter is in
fact a digit, e.g., the 6 in 67 million dollars is a lot of money.
And it probably _wants_ to say that the pseudo-element denotes the first
non-whitespace _character_, and this is how browsers take it.
IE6 needs the blank before the left curly bracket after the :first-x
selector.
Oh. Yes, so it seems. Thanks for this warning, too!
--
Jukka Yucca Korpela, http://www.cs.tut.fi/~jkorpela/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Conditional Comments - was css-d Digest, Vol 51, Issue 29
From: Kor Dwarshuis [EMAIL PROTECTED] due to the fact that I run multiple Internet Explorers on the same site.I found this here: http://www.quirksmode.org/css/condcom.html Note however, that if you use multiple Explorers on one computer, the conditional comments will render as if all these Explorer versions are the highest Explorer version available on your machine (usually Explorer 6.0). Note that this can be fixed with a little effort, so it's possible to have the IE versions viewing only the conditional comments directed at them, even on the same machine. http://www.positioniseverything.net/articles/multiIE.html ~holly __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Layout help needed
I have a site-under-development at http://www.runwithmcp.org/index.php The stylesheet is at http://www.runwithmcp.org/mcp.css The basic desired look can be seen in a graphic at http://www.runwithmcp.org/docs/mcpdraftsite2.gif. It's basically a two-column liquid layout (left-column fixed width). Inside the right column is the header (top), followed by the breadcrumbs area, and then the main content area. Optionally, there is an extra third_column. The layout design says that any third column will occupy its whole vertical space, but since it's likely to be short I like the way it is now, with the other content flowing around it. I have dotted borders on the troublesome DIVs, just for troubleshooting. Problems: Firefox: 1. The content (beginning with the item_title Saturday Long Run) is not at the top of its div. It should be even with the top of the Coach's Tip box. 2. The Coach's Tip heading (tip) is not at the top of its div. IE6: 1. The content (beginning with the item_title Saturday Long Run) is way down, not starting until after the material in the left column has finished. 2. Once it moves up, I'm sure the content item_title will still be low. But NOTE: the Coach's Tip heading (tip) IS at the top of its div! --- Mark Wilson, Computer Programming Unlimited Web: http://www.cpuworks.com/ Email: [EMAIL PROTECTED] or [EMAIL PROTECTED] Our motto: Getting the Job Done Check out the new AOL. Most comprehensive set of free safety and security tools, free access to millions of high-quality videos from across the web, free AOL Mail and more. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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 needed
it looks like there is anh2subheading/h2 in your code that isn't visible on the page. this seems to be pushing the saturday long run down. haven't really looked at the other problems though. -- Jeffrey Morin __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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 needed
[EMAIL PROTECTED] wrote:
Problems:
Firefox:
1. The content (beginning with the item_title Saturday Long Run)
is not at the top of its div. It should be even with the top of the
Coach's Tip box.
As jeffrey said, you have a white h2 element on a white background
forcing everything down.
2. The Coach's Tip heading (tip) is not at the top of its div.
I found I could fix this by explicitly setting the padding:
h3 { margin-top: 0;}
IE6:
1. The content (beginning with the item_title Saturday Long Run)
is way down, not starting until after the material in the left column
has finished.
I think it's the 100% width in the #content rule, one I commented this
out it looked fine in IE(7) and Firefox, didn't test in anything else.
2. Once it moves up, I'm sure the content item_title will still be
low.
Same problem as with Firefox, your invisible h2 content.
Rob
PS. Sorry if this turns up twice, slight Thunderbird issue...
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] clear :after method
Web Developer wrote: Am I wrong in IE7 applies the :after and gets reset to display:block? or does the site word it wrong? 1: You're wrong (sorry :-) ). 2: IE7 is buggy (nothing new there). 3: The mentioned site doesn't explain well enough what happens. - IE7 does not understand ':after'. - IE7 needs a 'hasLayout' trigger, of which 'display: inline-block' is one of many. http://www.satzansatz.de/cssd/onhavinglayout.html#prop - The tricky part is that once 'display: inline-block' is used, the element will have 'Layout' no matter what, since no reset is found for that trigger-property... http://www.satzansatz.de/cssd/onhavinglayout.html#reset Thus adding 'display: block' later on has no effect on IE7, and that's how/why that solution works. Use with care. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] That fixed it! (Was Re: Layout help needed)
You guys (and gals) are da bomb! I'm embarrassed to realize that the sample
subheading (h2Subheading/h2) was still in there invisibly. LOL...
And the width-fix worked perfectly. Hooray! Thanks a ton...
---
Mark Wilson, Computer Programming Unlimited
Web: http://www.cpuworks.com/
Email: [EMAIL PROTECTED] or [EMAIL PROTECTED]
Our motto: Getting the Job Done
-Original Message-
From: [EMAIL PROTECTED]
To: [EMAIL PROTECTED]
Sent: Wed, 21 Feb 2007 2:12 PM
Subject: Re: [css-d] Layout help needed
[EMAIL PROTECTED] wrote:
Problems:
Firefox:
1. The content (beginning with the item_title Saturday Long Run) is not
at the top of its div. It should be even with the top of the Coach's Tip
box.
As jeffrey said, you have a white h2 element on a white background forcing
everything down.
2. The Coach's Tip heading (tip) is not at the top of its div.
I found I could fix this by explicitly setting the padding:
h3 { margin-top: 0;}
IE6:
1. The content (beginning with the item_title Saturday Long Run) is way
down, not starting until after the material in the left column has finished.
I think it's the 100% width in the #content rule, one I commented this out it
looked fine in IE(7) and Firefox, didn't test in anything else.
2. Once it moves up, I'm sure the content item_title will still be low.
Same problem as with Firefox, your invisible h2 content.
Rob
Check out the new AOL. Most comprehensive set of free safety and security
tools, free access to millions of high-quality videos from across the web, free
AOL Mail and more.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] navigation height expanding!
i have a main nav at the top of my page set up like so
ul id=mainNav
lia href=index.htmlimg src=images/nav-images/navigation_01.gif
alt=Home //a/lilia href=how_it_works.htmlimg
src=images/nav-images/navigation_02.gif alt=How it Works //a/li
lia href=physician_testimonials.htmlimg
src=images/nav-images/navigation_03.gif alt=Physician Testimonials
//a/li
lia href=about_bioneutrix.htmlimg
src=images/nav-images/navigation_04.gif alt=Bioneutrix Brand //a/li
lia href=order.htmlimg src=images/nav-images/navigation_05.gif
alt=Order Now //a/li
/ul
(i didn't want to use images for these but our designer insisted on using
this font )
the css looks like this
#mainNav {
position: absolute;
right: 236px;
top: 148px;
background: #006f3a;
height: 22px;
padding: 0;
margin: 0;
}
#mainNav a {
float: left;
}
my problem is that ie6 (i'm starting with this ie) is expanding the links so
that they are not floating right next to eachother. they float left but it
looks like steps going down tus expanding the height of the box. i've tried
adding line height and i've tried display: block as well as inline. if
anyone knows what's going on here please let me know. thanks!
www.goutcleanse.com
--
Jeffrey Morin
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] navigation height expanding!
sorry to keep at this but does anyone know why the absolute positioning looks fine on ff on my mac but gets shifed about 75px on a pc? www.goutcleanse.com -- Jeffrey Morin __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Div floating over
Hi all I am struggling at the following piece of code:
div id=Container
div id=MainContentArea
div id=LeftContent/div
div id=RightContent/div
div id=GuitarInStripe/div
/div
div id=Footercopy; - 2007. travisfalls.com. All Rights
Reserved./div
/div
I have the LeftContent area floating left with a width of 55%. The
LeftContent and Right Content display great next to each other.
The Left column however displays outside of MainContentArea. I was
expecting the bottom edge of MainContentArea would coincide with the bottom
edge of LeftContent. What should I look at? I am very new to styles... I
was a table guy.
Best Regards,
Travis
#Container
{
border:dashed 2px #669900;
padding-left:15px;
padding-right:10px;
padding-top:8px;
background-image:url(Images/PageBackground.jpg);
background-repeat:repeat-y;
height:100%;
}
#MainContentArea
{
border:dashed 2px #667700;
background-image:url(Images/RugbyGuyBackground.jpg);
background-repeat:no-repeat;
background-position:left bottom;
width:800px;
font-size:80%;
}
#LeftContent
{
border:dashed 2px #00;
width:55%;
margin-right:15px;
padding-bottom:20px;
float:left;
}
#RightContent
{
border:dashed 2px #665500;
width:40%;
}
#Footer
{
border:dashed 2px #660011;
position:absolute;
bottom:2px;
clear:both;
color:#ff;
font-size:75%;
text-align:center;
height:19px;
padding:4px;
width:90%;
}
#GuitarInStripe
{
background-image:url(Images/RacingStripesGuitar.jpg);
background-repeat:no-repeat;
width:118px;
height:259px;
position:absolute;
bottom:30px;
left:755px;
}
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Horizontal scroll bar and missing content
The example: http://dev.webnonsense.org/kent/home.htm The problem: resize the window until you get a horizontal scroll bar. now scroll to the right. portions of the header and nav go missing. Stumped. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] IE Print Defect
Has anyone noticed IE not printing out all the text from a web page before? It is doing that to me now. Most of the words are there but a few that should be at the end of a line before it wraps to the next line have disappeared. I don't have a URL since this is being developed at my work. I am being asked to fix the print style sheet (there is none, currently) and to me it simply seems like an IE defect and not a CSS issue, but maybe somebody knows a CSS solution. Thanks in advance. Christian Z. Check Out the new free AIM(R) Mail -- 2 GB of storage and industry-leading spam and email virus protection. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] Hover issue
Kenoli Oleari wrote:
This now my code in the stylesheet and I am still getting a background
on hover:
a {
color: #FF;
font-size: small;
}
a:active {color: #339933; }
a:visited {color: #006633; }
a:hover {
color: #003366;
background-color: #00}
a.button:hover { background-color: none; }
Hi Kenoli,
Oops, focused on the cascade order, I didn't notice before; but it has
to be:
a.button:hover { background-color: transparent; }
or
a.button:hover { background: none; }
for
a.button:hover { background-color: none; }
is not valid css. A color none doesn't exist! :-)
If {background: none;}is set, then all properties are set to their
initial values (which is transparent for a background-color).
See: css-specs, background-properties
http://www.w3.org/TR/CSS21/colors.html#background-properties
Greetings,
francky
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] line break and fieldset height problems
Greetings! I need help figuring out a couple of things on the page at http://www.yourtimematters.com/problem_page.html It's looking pretty much like I want it to look in FF with the exception of (1) below. I can live with the way it looks in IE7. I've got a problem I can't figure out in IE6. I haven't tried to fix IE5.5 or IE5.0 yet but hope, with your help on the items below, that I may be able to figure it out without bothering you again. I would appreciate any feedback on how bad the situation is on the Mac browsers. Ths problems I know about are: 1) In FF the line is breaking well short of the clock div. I tried putting a margin-left on the clock div but that did no good so I'm guessing there's something else that's causing that problem. That part of the page renders ok in IE7. 2) In IE6, the fieldset.around_images is way to tall and I can't figure out what's pushing it down. It would be great to be able to bring the outer fieldset up about an em, but I can live with what I've got if necessary. Clicking on any of the tabs (the source of which I'm sure you all recognize) will take you to the section's start page. Feel free to explore if you like ! Any and all feedback, on any front, is both welcome and appreciated. Best regards, Bill __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] line break and fieldset height problems
1) In FF the line is breaking well short of the clock div. I tried putting a margin-left on the clock div but that did no good so I'm guessing there's something else that's causing that problem. That part of the page renders ok in IE7. FF seems to be doing it right. #clock_reset_button is what's causing the gap to the left of the clock. You're using relative positioning to move it to the right, but when you use relative positioning, other things (the text in this case) still flow around its original location. As far as that text is concerned, #clock_reset_button is still 111px farther to the left. I'd recommend using something other than relative positioning to get that button where it belongs. Don't have time right now to figure out what would work tho. Maybe someone else will. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] clear :after method
hey Gunlaug Sørtun, i was just curious, it says As of IE7, overflow became a layout-trigger. wasnt this a layout trigger in previous IE versions though? I remember applying overflow: hidden or auto to divs which contain floats which then contains the floats... i thought the reason was since it gave the parent element 'hasLayout' in IE 6 as well? is this not true? Thanks, Arian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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/
