Re: [css-d] centering divs within divs / jumping columns
Stuart King wrote:
If I have a 2 column layout with a footer.
The content background is 780px by 412px.
How do I make sure that the content div is the same dimensions, even with
little content (I want the entire background to show)
example:
http://www.triviumwine.com/continuum_site/pages/vision.html
Underneath this - how do I place the footer.
thank you.
1/ Backup your entire current CSS for the above page in case you need to
go back to it.
2/ Replace your entire current CSS for the above page with this:
html, body {
margin : 0;
padding : 0;
}
body {
background-color : #fff;
color : #493415;
font : 100%/1.8 Verdana, Arial, Helvetica, sans-serif;
text-align : center;
}
#outerWrapper #contentWrapper {
overflow : hidden;
border : 1px solid red;
}
* html #outerWrapper #contentWrapper {
overflow : visible;
border : 1px solid red;
} /*for ie/6*/
img {
display : block;
}
h1 {
color : #960711;
font-size : 120%;
font-weight : normal;
line-height : 1.8;
letter-spacing : 0.4em;
}
h2 {
color : #960711;
font-size : 100%;
line-height : 1.8;
letter-spacing : 0.4em;
margin : 0;
}
p {
font-size : 90%;
font-family : Times New Roman, Times, serif;
font-style : italic;
line-height : 1.8;
text-align : center;
}
a:link {
font-size : 75%;
color : #a88243;
}
a:visited {
color : #a88243;
}
a:hover {
color : #00;
}
a:active {
color : #960711;
}
.psanserif {
color : #960711;
text-align : center;
font-style : normal;
letter-spacing : 0.2em;
}
#leftColumn1 ul {
list-style-type : none;
margin : 0;
padding : 0;
}
#leftColumn1 li a {
display : block;
color : #f9f2c7;
padding : 4px 0 4px 2px;
width : 145px;
font-size : 80%;
}
#leftColumn1 li a:hover, #leftcol li a:focus {
background-color : #6f5020;
color : #e3d7a5;
}
#leftColumn1 a#current {
background-color : #694c1e;
color : #f9f2c7;
}
#botmenu {
text-align : center;
margin : 50px 0 0 0;
font-size : 75%;
color : #a88243;
}
#outerWrapper {
margin : 50px auto 0 auto;
text-align : center;
width : 780px;
background : url(../images/cont_bk.jpg);
}
#outerWrapper #contentWrapper #leftColumn1 {
float : left;
padding : 24px 0 0;
width : 148px;
}
#outerWrapper #contentWrapper #content {
margin : 0 0 0 148px;
padding : 10px 24px 10px 24px;
}
table {
font-size : 75%;
text-align : center;
}
#outerWrapper #footer {
background-color : red;
clear : both;
}
*Note* that this was done live in the Firefox Web Developer Toolbar
thing tand that it has not been checked.
Is this /any/ close to what you have in mind?
When you reply, please reply to the list as well as me.
__
css-discuss [EMAIL PROTECTED]
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] centering divs within divs / jumping columns
I agree. (Not about the 'brightest star'!!! g). It works fine in IE6, IE7, Firefox, Opera and Safari, apart from Firefox rendering the footer with more height than you intended. Could it be that your browser didn't refresh after you tried it when it was wrong? Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus - Original Message - From: David Laakso To: Stuart King Cc: css discuss Sent: Friday, April 04, 2008 5:44 AM Subject: Re: [css-d] centering divs within divs / jumping columns Stuart King wrote: I am still having trouble. How do I get the footer down underneath the wrapper. The height of the body should be 412 px with the footer (CONTINUUM) directly below. URL http://www.triviumwine.com/continuum_site/pages/vision.html thanks. --s I am not the brightest star in the sky so I may be missing something that is obvious. But on this end, it appears that it is rendering as anticipated. If you want to keep the text from heading toward South America with user discretion to scale fonts, then there may be some question... __ css-discuss [EMAIL PROTECTED] 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] FF and IE problems
OK, Cheers I will remove all the table bit from around my layout and
the just just the css to make the layout?
Cheers,
Andrew
Alan K Baker wrote:
Sorry, I haven't time to wade through entire stylesheets tonight, but
assuming that your stylesheets don't do anything 'clever' with table
definitions, it looks as if your divs are wrapped by table/table tags
which AFAIK would follow each other in the HTML 'flow', so each table will
appear below the last regardless of the fact that you have no TRs and TDs
defined. This would invalidate your 'box model' flow styling.
I suggest dumping all TABLE definitions unless you are truly using a table
def for a real table, and use CSS to do all of your placement.
Regards,
Alan.
www.theatreorgans.co.uk
www.virtualtheatreorgans.com
Admin: Conn Artistes, UKShopsmiths, 2nd Touch AP Groups
Shopsmith 520 bits
Flatulus Antiquitus
- Original Message -
From: Andrew Doades
To: Alan K Baker
Cc: css-d@lists.css-discuss.org
Sent: Thursday, April 03, 2008 10:34 PM
Subject: Re: [css-d] FF and IE problems
In my css file:
#sidebar {
float:left;
width:165px;
border: 3px solid #aaa;
background-color: #eee;
margin:2px;
padding: 1em;
}
#content-main {
float:none;
width:100%;
}
then in my template I just put that links and that in a div id=sidebar
and a content-main one for content
__
css-discuss [EMAIL PROTECTED]
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/
__
css-discuss [EMAIL PROTECTED]
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/
[css-d] Background in IE6 and 7
Dear List, I have a table theading (theadtrth) which has a background image set on the tr. I also have a small arrow image set as a background image to a link in each th to indicate the direction of sort. In FF all works as expected, however in IE6+7 oon XP (all I have tested thus far) the th has a white bg which hides the tr background. I haven't found anything written on this yet, anybody know how I can make that th background transparent? Or any articles about this? The arrow image is set like this: background: transparent url(../images/arrow.png) right center no-repeat; Thanks, Mark __ css-discuss [EMAIL PROTECTED] 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/
[css-d] CSS newb -- IE question
I'm using the dotted attribute for borders to indicate links/nav and design a blog page. Does it always show up as dashed instead of dotted in IE? Seems to work fine in Firefox and Safari. Am I missing something? Thanks!! www.jacalynlee.com __ css-discuss [EMAIL PROTECTED] 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] html background bug?
On Fri, Apr 4, 2008 at 12:43 PM, Pentasis wrote: Set background-color of html-element to 'transparent' set width of body element to anything smaller than the viewport and center it (margin:0 auto;) Make sure padding of body is 0 Apply a background color to the body element (for example red) Now suddenly the whole background is red, in other words, the background-color of the body element seeps into it's margins. But margins are supposed to be transparent according to the spec (I can't find an exception anywhere). This is probably correct according to what is in the spec at [1], in particular: The background of the root element becomes the background of the canvas and covers the entire canvas... For HTML documents, however, we recommend that authors specify the background for the BODY element rather than the HTML element. For HTML documents whose root HTML element has computed values of 'transparent' for 'background-color' and 'none' for 'background-image', user agents must instead use the computed value of those properties from that HTML element's first BODY element child when painting backgrounds for the canvas, and must not paint a background for that BODY element. In short: if there is no background on HTML (i.e. it is transparent), then the background specified on BODY is applied to the whole canvas, not really to the BODY. Bruno [1] http://www.w3.org/TR/CSS21/colors.html#background -- Bruno Fassino http://www.brunildo.org/test __ css-discuss [EMAIL PROTECTED] 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/
[css-d] html background bug?
I am not sure if this is a bug (known or unknown) or normal bahaviour. But I found out about it by accident and have been looking for an explanation ever since, but can't find it. Here is how you reproduce it: Set background-color of html-element to 'transparent' set width of body element to anything smaller than the viewport and center it (margin:0 auto;) Make sure padding of body is 0 Apply a background color to the body element (for example red) Now suddenly the whole background is red, in other words, the background-color of the body element seeps into it's margins. But margins are supposed to be transparent according to the spec (I can't find an exception anywhere). I tested this in IE7, FF2, Opera9 and Safari3, they all display this behaviour making me think it is normal, but according to the spec margins should always be transparent so what is going on here??? Bert __ css-discuss [EMAIL PROTECTED] 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 newb -- IE question
On Apr 4, 2008, at 7:15 PM, Jen Guthrie wrote: I'm using the dotted attribute for borders to indicate links/nav and design a blog page. Does it always show up as dashed instead of dotted in IE? Seems to work fine in Firefox and Safari. Am I missing something? Thanks!! www.jacalynlee.com If by 'IE' you mean IE 6, then yes, that is the case. That works correctly in IE7 in standards mode at least. PS - it is not the 'dotted' attribute, it is the 'dotted' value for the border(-style) property. Just nitpicking. Philippe --- Philippe Wittenbergh http://l-c-n.com/ __ css-discuss [EMAIL PROTECTED] 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 newb -- IE question
Jen Guthrie wrote: I'm using the dotted attribute for borders to indicate links/nav and design a blog page. Does it always show up as dashed instead of dotted in IE? Seems to work fine in Firefox and Safari. Am I missing something? Thanks!! www.jacalynlee.com They don't show up at all in IE/win at default font size. When font is resized up they are dashed in IE6 and dotted in IE7. Try adding 'position: relative' to the relevant anchors to make IE/win stack them properly. You have also triggered the em font-resizing bug in IE5 - IE7... http://www.gunlaug.no/contents/wd_additions_13.html ...so font-resizing gives extreme results in those versions. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] 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] centering divs within divs / jumping columns
Alan K Baker wrote: http://www.triviumwine.com/continuum_site/pages/vision.html I agree. (Not about the 'brightest star'!!! g). It works fine in IE6, IE7, Firefox, Opera and Safari, apart from Firefox rendering the footer with more height than you intended. Could it be that your browser didn't refresh after you tried it when it was wrong? Regards, Alan. Alan, I suggest that you resize the text in all browsers that you are using to test in. It would seem the default font settings (like minimum font height) is different in Firefox as for the other browsers. Seems like I repeating myself by signing off. :-) Alan http://css-class.com/test/ __ css-discuss [EMAIL PROTECTED] 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 in IE6 and 7
IE 6 can't render .png files with alpha transparency properly. It displays the transparent part as white. Easiest way round that one is to replace the .png with a .gif. I can't think why there should be a problem with IE7 as the .png bug is fixed in e versions of IE7. Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus - Original Message - From: Mark Finney To: CSS Mailing List Sent: Friday, April 04, 2008 9:54 AM Subject: [css-d] Background in IE6 and 7 Dear List, I have a table theading (theadtrth) which has a background image set on the tr. I also have a small arrow image set as a background image to a link in each th to indicate the direction of sort. In FF all works as expected, however in IE6+7 oon XP (all I have tested thus far) the th has a white bg which hides the tr background. I haven't found anything written on this yet, anybody know how I can make that th background transparent? Or any articles about this? The arrow image is set like this: background: transparent url(../images/arrow.png) right center no-repeat; Thanks, Mark __ css-discuss [EMAIL PROTECTED] 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/ __ css-discuss [EMAIL PROTECTED] 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] **VL-JUNK** W3C and opacity in IE7
Stephen Davis wrote: Is their any way of fixing CSS to achieve validation for the opacity property used by IE, I get parser error for filter:alpha(opacity=50) and several other opacitys'. http://www.arithmetic.890m.com regards steve Yes. Feed those rulesets to IE in conditional comments. Scroll down a little to see conditional comments on this page [1]. Note this will not make those rules valid: it will simply hide them from the w3c CSS Validation Service. [1] http://www.satzansatz.de/cssd/onhavinglayout.html#hack -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] 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 in IE6 and 7
Mark Finney wrote: Dear List, I have a table theading (theadtrth) which has a background image set on the tr. I also have a small arrow image set as a background image to a link in each th to indicate the direction of sort. In FF all works as expected, however in IE6+7 oon XP (all I have tested thus far) the th has a white bg which hides the tr background. I haven't found anything written on this yet, anybody know how I can make that th background transparent? Or any articles about this? The arrow image is set like this: background: transparent url(../images/arrow.png) right center no-repeat; Thanks, Mark Check your CSS and see if you have this. background: transparent url(../images/arrow.png)right center no-repeat; There is no whitespace between png)right and this would cause IE5~IE7 to throw such a background string out. Can you put up a live test case showing the problem? Alan http://css-class.com/test/ __ css-discuss [EMAIL PROTECTED] 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 Simple Three Column Layout
Carol Huddleston wrote: I'm trying to make a simple three-column layout, with a sidebar on either side of a central column of content. I have the markup and the CSS exactly as the book describes, but the sidebars both hang down below the content column. http://home.comcast.net/~prairiedream/beginning/ The book must either be wrong, or you've interpreted it wrongly. Sidebar a and b can't float up in content's margins. To make it work you'll have to change the order in the markup so content comes after both sidebars in the markup. That'll give you this... http://www.gunlaug.no/tos/alien/ch/test_08_0404.html regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] 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 Simple Three Column Layout
Hi, If you move the content div after the sidebar divs in the html it works. hope I helped. Shlomi. Quote Carol Huddleston: ... I'm trying to make a simple three-column layout, with a sidebar on either side of a central column of content. I have the markup and the CSS exactly as the book describes, but the sidebars both hang down below the content column. According to the book, all three columns should be lined up on FF and Safari (but not IE 5 or 5.5). Can anyone see the problem? Here is the page: http://home.comcast.net/~prairiedream/beginning/ and here is the CSS: http://home.comcast.net/~prairiedream/beginning/columns.css Thanks very much for your help! Carol __ css-discuss [EMAIL PROTECTED] 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/
[css-d] float right, then on next line float right
I'm trying to make a new template for my site by starting over and replicating the way that the old site looked. On the top, I'm trying to have a few elements align right within a container, then another item aligned right below it, then an item aligned left. I'm just learning css and I'm having problems floating right, but still putting items on different lines. Here's what I have: http://sph.umd.edu/includes/header_top_lvl2_a_test.cfm I want the login button on a second line, still on the right but under the search features. Then on a third line, the logo on the left. I'm trying to get it to look like the top of: http://sph.umd.edu/home/blank.cfm I can get it to work by setting a pixel height to the class search_block, but that feels more like a hack. It seems to me that this is really a problem with the way that I set up the flow. Any assistance would be appreciated. -- Daniel Kessler University of Maryland College Park School of Public Health 3302E HHP Building College Park, MD 20742-2611 Phone: 301-405-2545 http://sph.umd.edu __ css-discuss [EMAIL PROTECTED] 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 in horizontal nav
I also forgot to mention that it only shows when you hover over the link... if that helps any. __ css-discuss [EMAIL PROTECTED] 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] float right, then on next line float right
Daniel Kessler wrote:
http://sph.umd.edu/includes/header_top_lvl2_a_test.cfm
I want the login button on a second line, still on the right but
under the search features. Then on a third line, the logo on the
left. I'm trying to get it to look like the top of:
http://sph.umd.edu/home/blank.cfm
Try:
div.container {border: 1px solid red;overflow: hidden; /*add to current
selector*/}
img {float: left;clear:both;/*add ruleset to style sheet*/}
--
http://chelseacreekstudio.com/
__
css-discuss [EMAIL PROTECTED]
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 Simple Three Column Layout
Thank you all for your help! The book is right and has the markup listed in the right order. When I followed along, I modified some previous markup that I already had typed in, and didn't realize that the order was important. So much to remember! Thanks again, Carol __ css-discuss [EMAIL PROTECTED] 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 in horizontal nav
Matt Tibbits wrote: I also forgot to mention that it only shows when you hover over the link... if that helps any. Dunno. Validate the markup and bring it back. -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] 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] Anchor tags
Hi. Thanks for the reply.
I had started to think along these lines, but not actually worked it out. :-)
I've tried what you suggest and it works fine in IE7, Firefox, Opera and
Safari, however it refuses to work in IE 6. Any ideas?
Here's the code:
htmlbody!-- . Some stuff. --
div id=selectablea href=scripts/welcome.html/a/div
!-- As a temporary measure for IE6 --
!--[if lte IE 6]div id=clickentera href=scripts/welcome.htmlPlease
click here to enter/a/div![endif]--
/body/html
/* CSS */
#selectable a {
background-image: url(../images/logos/trans1px.gif);
width: 100%;
height:100%;
display: block;
z-index: 1;
position:absolute;
bottom:0;
}
selectable a:hover {
background-image: url(../images/logos/trans1px.gif);
}
Regards,
Alan.
www.theatreorgans.co.uk
www.virtualtheatreorgans.com
Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups
Shopsmith 520 + bits
Flatulus Antiquitus
- Original Message -
From: Alan Gresley
To: Alan K Baker
Cc: css-d@lists.css-discuss.org
Sent: Friday, April 04, 2008 6:15 AM
Subject: Re: [css-d] Anchor tags
Alan K Baker wrote:
Hi all.
I have a need for an entire index page to be contained within an anchor, so
that anyone visiting the site would have to simply click anywhere within the
page to bring up the next screen.
As a tags can't contain divs , does anyone have a technique to achieve
this?
Regards,
Alan.
At the end of you source code insert a anchor within a container that
has no position whatsoever. Then style this anchor with.
a.selectable {
width: 100%;
height:100%;
display: block;
z-index: 1;
position: absolute;
bottom:0;
}
And for all versions of IE use this.
a.selectable:hover {
background-image: url(transparent-1by1px.png);
}
If the page is higher than the viewpoint you may wish to have it
position fixed for the better browsers.
Alan
http://css-class.com/test/
__
css-discuss [EMAIL PROTECTED]
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/
__
css-discuss [EMAIL PROTECTED]
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 in horizontal nav
Matt Tibbits wrote: I also forgot to mention that it only shows when you hover over the link... if that helps any. Firstly IE has a whitespace bug with list [1] [2]. I think this is due to IE wanting to show the list default padding and margins different to all other browsers. All versions of IE will show strange jumps when anchor links are hovered but for many weird reasons. Do you have a URL? If one have already been provided then the URL should always be shown in each response in a thread. [1] http://www.brunildo.org/test/IE8b1_li_float_space.html [2] http://css-class.com/test/bugs/ie/listitemsfloatsandmargins.htm Alan http://css-class.com/test/ __ css-discuss [EMAIL PROTECTED] 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] hr / styling
I just found another bug in Firefox 2.0.0.13 which I haven't seen listed
anywhere else.
If I style hr / as follows: hr {color:red;} it does appear as red and
displays correctly in most browsers.
However, in Firefox it displays, but with an enormous amount of top and
bottom padding.
This also causes problems with floats, which tend to float upwards and
partially cover the horizontal rule, leaving a large gap where the float sits.
The good news is that it can be cured. :-)
Just add margin:0; padding:0; to the hr style and all's well.
Your problem description is not conclusive so can you show this in a
link? You say an enormous amount of top and bottom padding, but
later on you set also _margin_ = 0?
And what is enormous in pixels?
Manfred
__
css-discuss [EMAIL PROTECTED]
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] Anchor tags
Alan K Baker wrote:
Hi. Thanks for the reply.
I had started to think along these lines, but not actually worked it out. :-)
I've tried what you suggest and it works fine in IE7, Firefox, Opera and
Safari, however it refuses to work in IE 6. Any ideas?
Here's the code:
htmlbody!-- . Some stuff. --
div id=selectablea href=scripts/welcome.html/a/div
!-- As a temporary measure for IE6 --
!--[if lte IE 6]div id=clickentera href=scripts/welcome.htmlPlease
click here to enter/a/div![endif]--
/body/html
/* CSS */
#selectable a {
background-image: url(../images/logos/trans1px.gif);
width: 100%;
height:100%;
display: block;
z-index: 1;
position:absolute;
bottom:0;
}
selectable a:hover {
background-image: url(../images/logos/trans1px.gif);
}
Regards,
Alan.
Alan can you please stop top posting. It's make it hard to follow a
thread. Observe how I have my replied underneath your message.
BTW, you changed my code. I had.
a.selectable {
width: 100%;
height:100%;
display: block;
z-index: 1;
position: absolute;
bottom:0;
}
And for all versions of IE use this.
a.selectable:hover {
background-image: url(transparent-1by1px.png);
}
This is the solution I have used here.
http://css-class.com/x/list-items-and-hover.htm
and similar
http://www.gunlaug.no/tos/alien/lin/test_08_0312.html
though Georg's example shows the list whitespace bug in IE8.
Also you have
selectable a:hover
shouldn't that be
#selectable a:hover
What you want in your source is this
html
body
div id=wrapper
!-- . Some stuff. --
a class=selectable href=scripts/welcome.html/a
/div
/body
/html
Alan
http://css-class.com/test/
__
css-discuss [EMAIL PROTECTED]
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/
[css-d] Centering DIV block without setting its width.
A newbie question: I am trying to center a DIV block without specifying its width explicitly: I'd like the width to depend on DIV's contents. I set 'display' property to 'table' as shown below: html headtitleCentering DIV/title/head body div style=margin-left: auto; margin-right: auto; display: table hello! /div /body /html This works (at least in Firefox and Opera) but I'm not sure if this is a correct technique. Is there a right way do center a block without setting its width property explicitly? Thanks in advance, Yuri __ css-discuss [EMAIL PROTECTED] 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] float right, then on next line float right
This worked. I also applied clear:both; to my login class and it
helped there too.
Reading up on Clear helped my understanding of float, so thanks for
that too.
Luckily work has approved for me to buy some css books and study up.
Thank you very much. Have a good weekend!
On Apr 4, 2008, at 12:13 PM, David Laakso wrote:
Daniel Kessler wrote:
http://sph.umd.edu/includes/header_top_lvl2_a_test.cfm
I want the login button on a second line, still on the right but
under the search features. Then on a third line, the logo on the
left. I'm trying to get it to look like the top of:
http://sph.umd.edu/home/blank.cfm
Try:
div.container {border: 1px solid red;overflow: hidden; /*add to
current selector*/}
img {float: left;clear:both;/*add ruleset to style sheet*/}
--
Daniel Kessler
University of Maryland College Park
School of Public Health
3302E HHP Building
College Park, MD 20742-2611
Phone: 301-405-2545
http://sph.umd.edu
__
css-discuss [EMAIL PROTECTED]
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] IE6 and IE7 on the same machine
Don't think so. When I tried to use both on my desktop the machine developed something like an allergic reaction to IE six. If anybody wants details I'll do my best to explain, but in answer to Cristain's question: nope, can't be done. Stoopid Micro$oft. On Thu, Apr 3, 2008 at 12:44 PM, Cristian Palmas [EMAIL PROTECTED] wrote: Hi, Can I install on my Win XP SP2 PC Internet Explorer 7 but keeping the IE6 for test purposes? Thanks -- ~ Cristian Palmas ~ __ css-discuss [EMAIL PROTECTED] 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/ __ css-discuss [EMAIL PROTECTED] 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] IE6 and IE7 on the same machine
works fine for me, all day long: This contains everything except IE 7: http://tredosoft.com/Multiple_IE This contains IE 7: http://tredosoft.com/IE7_standalone On Fri, Apr 4, 2008 at 2:07 PM, Katherine Coynor [EMAIL PROTECTED] wrote: Don't think so. When I tried to use both on my desktop the machine developed something like an allergic reaction to IE six. If anybody wants details I'll do my best to explain, but in answer to Cristain's question: nope, can't be done. Stoopid Micro$oft. On Thu, Apr 3, 2008 at 12:44 PM, Cristian Palmas [EMAIL PROTECTED] wrote: Hi, Can I install on my Win XP SP2 PC Internet Explorer 7 but keeping the IE6 for test purposes? Thanks -- ~ Cristian Palmas ~ __ css-discuss [EMAIL PROTECTED] 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/ __ css-discuss [EMAIL PROTECTED] 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/ __ css-discuss [EMAIL PROTECTED] 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/
[css-d] Conceptual problems with the doctype
Hello Validating the html on a site built this week, and the only remaining uncorrected error is to do with the doctype. I don't understand the instruction: I tried putting in the line the validator says is missing but that produced a new error. At the moment I have !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd; If I have to add html xmlns=http://www.w3.org/1999/xhtml; xml:lang=en lang=en where does it go, and doesn't that mean two closing /html tags at the foot of the page instead of the normal one? URL, if needed (this is the development area - there is a temporary page on the client's domain www.egg-skelter.co.uk) http://www.longitude0.co.uk/egg-skelter/development/index.php TVIA Rachel __ css-discuss [EMAIL PROTECTED] 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] Conceptual problems with the doctype
- Original Message - From: Rachel Mawhood To: css-d@lists.css-discuss.org Sent: Friday, April 04, 2008 8:17 PM Subject: [css-d] Conceptual problems with the doctype Hello Validating the html on a site built this week, and the only remaining uncorrected error is to do with the doctype. I don't understand the instruction: I tried putting in the line the validator says is missing but that produced a new error. At the moment I have !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd; If I have to add html xmlns=http://www.w3.org/1999/xhtml; xml:lang=en lang=en where does it go, and doesn't that mean two closing /html tags at the foot of the page instead of the normal one? URL, if needed (this is the development area - there is a temporary page on the client's domain www.egg-skelter.co.uk) http://www.longitude0.co.uk/egg-skelter/development/index.php TVIA Rachel On two lines like this: !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd; html xmlns=http://www.w3.org/1999/xhtml; head will work fine. Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus __ css-discuss [EMAIL PROTECTED] 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] IE6 and IE7 on the same machine
- Original Message - From: Ben Fider To: Katherine Coynor Cc: css-d@lists.css-discuss.org Sent: Friday, April 04, 2008 8:11 PM Subject: Re: [css-d] IE6 and IE7 on the same machine works fine for me, all day long: This contains everything except IE 7: http://tredosoft.com/Multiple_IE This contains IE 7: http://tredosoft.com/IE7_standalone Yes it does. I also use it all day long. One word of warning. When you install it, make sure that nothing else is running. It screwed up my network connections, because I forgot and left IE7 running. A tweak and a re-boot eventually fixed it. :-) Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus __ css-discuss [EMAIL PROTECTED] 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/
[css-d] urgent - deadline: background image in list doesn't change
Good afternoon list, I needed to make my backgound image on my nav menu bigger, but it only kicks in on one page. The image is set in my stylesheet. As i'm on a real urgent deadline, i'm probably overlooking something obvious but can somebody take a look and see what's missing? Much obliged! http://www.mendesperestransportes.com.br/Pages/equipamentos.php http://www.mendesperestransportes.com.br/Styles/MP.css -- Best regards, Luc Using the best e-mail client: The Bat! version 4.0.18 with Windows XP (build 2600), version 5.1 Service Pack 2 and using the best browser: Opera. Absolutely nothing in the world is friendlier than a wet dog. __ css-discuss [EMAIL PROTECTED] 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] IE6 and IE7 on the same machine
Damn, this is slick! Thanks! On Fri, Apr 4, 2008 at 3:28 PM, Alan K Baker [EMAIL PROTECTED] wrote: - Original Message - From: Ben Fider To: Katherine Coynor Cc: css-d@lists.css-discuss.org Sent: Friday, April 04, 2008 8:11 PM Subject: Re: [css-d] IE6 and IE7 on the same machine works fine for me, all day long: This contains everything except IE 7: http://tredosoft.com/Multiple_IE This contains IE 7: http://tredosoft.com/IE7_standalone Yes it does. I also use it all day long. One word of warning. When you install it, make sure that nothing else is running. It screwed up my network connections, because I forgot and left IE7 running. A tweak and a re-boot eventually fixed it. :-) Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus __ css-discuss [EMAIL PROTECTED] 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/ __ css-discuss [EMAIL PROTECTED] 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/
[css-d] Still nav problems (background seems fine)
Good afternoon list, Still having problems with my nav the background image seems to be working but between Equipamentos Transportados and Nossa Frota is a gap i can't seem to get rid off. Also, the border at the right side of Equipamentos is bigger then it should be. What's puzzling me is that it seems to be just that li... Also, what would be the best way to have the text of the li's in the nav centered vertically? Adjusting padding with another ruleset, presuming i can't do it in the ul ruleset? Sorry for the maybe easy questions but i'm in a real pickle here http://www.mendesperestransportes.com.br/Pages/equipamentos.php http://www.mendesperestransportes.com.br/Styles/MP.css The section to look for is at the bottom of the stylesheet, commented /*Navigation*/ -- Best regards, Luc Using the best e-mail client: The Bat! version 4.0.18 with Windows XP (build 2600), version 5.1 Service Pack 2 and using the best browser: Opera. When an Australian buys a new boomerang, how does he throw the old one away? - Zap - Italian comedian __ css-discuss [EMAIL PROTECTED] 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] Still nav problems (background seems fine)
Luc wrote:
Still having problems with my nav the background image seems to
be working but between Equipamentos Transportados and Nossa Frota
is a gap i can't seem to get rid off. Also, the border at the right
side of Equipamentos is bigger then it should be. What's puzzling
me is that it seems to be just that li...
http://www.mendesperestransportes.com.br/Pages/equipamentos.php
Not enough background-image vertically for two text-lines, so the
missing part appears as a gap.
Make that:
#navcontainer li {
background : transparent url(../Images/navbackgroundbig.gif) repeat-y 0
0.1em;
margin : 0.5em;
/* no height */
}
...and there will be no gap. I think that answers your second question
too, if I understood you correctly.
Centering text in _equal-height_ li's requires an HTML table for nav,
since IE7 and older don't support CSS table.
Please don't keep changing things when you ask for help. It's impossible
to debug a moving target.
regards
Georg
--
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
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] Centering DIV block without setting its width.
Hi Benjamin, Thank you for your response. If you want the text (and other inline elements) inside this DIV to be centered you could set text-align to center. However, I'm guessing you don't want that precisely. This is true, I'd like only the container to be centered. I'm not sure I understand why you wouldn't want to set a width explicitly if you know you want it to be centered. The DIV block holds a table with varying number of columns and some other elements that I'd like to keep together with the table. If it were just a table it would not be a problem because of the way the widths are computed. http://www.w3.org/TR/CSS21/tables.html#width-layout Oh, and the display: table settings are not very well supported at the moment. I'd steer clear of them for now. This is my concern too. I'll probably think of something different. Thanks again for your response. Yuri __ css-discuss [EMAIL PROTECTED] 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] Still nav problems (background seems fine)
Out of curiosity... is your message just to me intended or domething went wrong with you replying to the list? Hi Luc, I belong to 2 lists and the other only requires me to reply to sender. This list requires me to reply to all. So to answer your question it was meant for the list. One of these days I'll screw my head on right. Best regards, Kepler Gelotte Neighbor Webmaster, Inc. 156 Normandy Dr., Piscataway, NJ 08854 www.neighborwebmaster.com phone/fax: (732) 302-0904 __ css-discuss [EMAIL PROTECTED] 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] WAS: urgent - deadline: background image in list doesn't change
2008/4/4, Luc [EMAIL PROTECTED]: Good afternoon list, Seem i was to hasty on the mail trigger... need to adjust my paddings and margins it seems sorry to waste everybody's time!!! -- Best regards, Luc Asking questions and sharing informations is never a waste of time. Don't worry about it. Glad to know you fixed your problems. Goodnight. (Well, in Italy is actually night...) -- ~ Cristian Palmas ~ __ css-discuss [EMAIL PROTECTED] 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/
[css-d] Links in floating div aren't working in FF
(First time poster here. Hope you can help me!)
I'm an amateur coder, asked to overhaul an existing website for a non-profit
in Ontario (http://www.unemployedhelp.on.ca). The website is a mess of
nested tables and font tags. They want me to retain the look of the site,
but make a CSS-based design (primarily so it is better accessible to screen
readers, but also so that it is more maintainable, content wise).
I've posted a couple of pages of my re-designed site at
http://www.darrenbest.com/DRUHC/clientguide.html and
http://www.darrenbest.com/DRUHC/clientguide1.html . The (admittedly
cluttered) stylesheet is at
http://www.darrenbest.com/DRUHC/images/clientstyle.css (I'll clean it up a
bit when I'm done).
Comparing the output of my pages in Firefox 2 and IE6 yields a few
differences. Normally, I've been getting results I expect in FF and having
to figure out IE, but this time I don't know what's up with FF.
My issue is with the navigation boxes on the right side (within a div named
ogeNav). In my style sheet, I have the following:
#ogeNav {
float: right;
margin: 10px 125px 10px 10px;
width: 165px;
}
* html #ogeNav {display:inline;} /* IE6 hack*/
This makes the elements placed properly, but here's the problem: the links
within this floated div work in IE at all times, but in FF the links are
covered by the main text of the page. On the clientguide1.html page,
none of the links work since the main content is taller than the floating
div. But on clientguide.html, the content only goes down a short
distance: the links in the floating div work from the point of Start now!
down, but won't work from that point up.
Can I do anything to make the main text not cover the floating div in
Firefox? Thanks in advance.
Darren Best
__
css-discuss [EMAIL PROTECTED]
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/
[css-d] Almost there!! But my nav buttons in IE...
In IE7 (I haven't checked IE6 yet), the button images are separating from each other, but in FF/Safari, they're not. They're NOT supposed to separate from each other, so they're supposed to look like they do in FF. Can anyone help me with this IE issue? BTW, I validate - CSS and HTML. I took Gunlaug's suggestion and put the background into one image. However, now I'm going to need to slice it in two so it can expand vertically with a tile image. I'll cross that bridge when I get to it. http://mdh-test.com/Quiel/index2.shtml http://mdh-test.com/Quiel/quiel.css Theresa Mesa Mesa Design House http://mesadesignhouse.com 909-796-5739 909-796-5789 (Fax) __ css-discuss [EMAIL PROTECTED] 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] Links in floating div aren't working in FF
On Apr 5, 2008, at 11:58 AM, Darren Best wrote:
(First time poster here. Hope you can help me!)
Welcome.
I've posted a couple of pages of my re-designed site at
http://www.darrenbest.com/DRUHC/clientguide.html and
http://www.darrenbest.com/DRUHC/clientguide1.html . The (admittedly
cluttered) stylesheet is at
http://www.darrenbest.com/DRUHC/images/clientstyle.css (I'll clean
it up a
bit when I'm done).
Comparing the output of my pages in Firefox 2 and IE6 yields a few
differences. Normally, I've been getting results I expect in FF and
having
to figure out IE, but this time I don't know what's up with FF.
My issue is with the navigation boxes on the right side (within a
div named
ogeNav). In my style sheet, I have the following:
The problem is this:
#supportingText {
position: relative; /* -- Here
margin: 0 125px 0 200px;
padding: 0 0 0 0;
}
making your container relative positioned kind of pulls it up (layers
it) in front of the floated side bar.
Add a background-color to #supportingText, and you'll see what happens.
Removing 'position:relative' solves the problem.
Philippe
---
Philippe Wittenbergh
http://l-c-n.com/
__
css-discuss [EMAIL PROTECTED]
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] Almost there!! But my nav buttons in IE...
This works in IE6 and IE7:
!--[if IE]style#containerLeft img {margin: 0 0 -3px 0;padding:
0;}/style![endif]--
but it's a bit of a 'dirty' fix. :-)
Might give you something to work on.
I must say that I would prefer to see the link buttons generated in a list. You
can then alter the list element margins to suit, and (for me) it works in all
browsers. You could also change the shading on each button to reflect the hover
and active states, by image displacement. See: www.michaelwooldridge.co.uk
Regards,
Alan.
www.theatreorgans.co.uk
www.virtualtheatreorgans.com
Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups
Shopsmith 520 + bits
Flatulus Antiquitus
- Original Message -
From: tmesa.mesadesignhouse
To: CSS-D List
Sent: Saturday, April 05, 2008 4:00 AM
Subject: [css-d] Almost there!! But my nav buttons in IE...
In IE7 (I haven't checked IE6 yet), the button images are separating
from each other, but in FF/Safari, they're not. They're NOT supposed
to separate from each other, so they're supposed to look like they do
in FF.
Can anyone help me with this IE issue?
BTW, I validate - CSS and HTML.
I took Gunlaug's suggestion and put the background into one image.
However, now I'm going to need to slice it in two so it can expand
vertically with a tile image. I'll cross that bridge when I get to it.
http://mdh-test.com/Quiel/index2.shtml
http://mdh-test.com/Quiel/quiel.css
Theresa Mesa
__
css-discuss [EMAIL PROTECTED]
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] Anchor tags
- Original Message -
From: Alan Gresley
To: Alan K Baker
Cc: css-d
Sent: Friday, April 04, 2008 7:17 PM
Subject: Re: [css-d] Anchor tags
Alan can you please stop top posting. It's make it hard to follow a
thread. Observe how I have my replied underneath your message.
BTW, you changed my code. I had.
a.selectable {
width: 100%;
height:100%;
display: block;
z-index: 1;
position: absolute;
bottom:0;
}
And for all versions of IE use this.
a.selectable:hover {
background-image: url(transparent-1by1px.png);
}
This is the solution I have used here.
http://css-class.com/x/list-items-and-hover.htm
and similar
http://www.gunlaug.no/tos/alien/lin/test_08_0312.html
though Georg's example shows the list whitespace bug in IE8.
Also you have
selectable a:hover
shouldn't that be
#selectable a:hover
What you want in your source is this
html
body
div id=wrapper
!-- . Some stuff. --
a class=selectable href=scripts/welcome.html/a
/div
/body
/html
Alan
-
As a courtesy to you I have 'bottom' posted, but 'top posting' is my 'style'.
No-one else has a problem with it, and I can't keep changing it to suit
everyone. :-)
Yes, I did alter your code because at first it would not work in any browser,
which may have been something to do with where I placed the HTML.
I've tried your code again and I've tried variations on it, but it still
won't work in IE6 and IE7 does 'strange' things! I have a header which is
positioned 'absolute', a container (with a background image) that is floated
left, and another container which is positioned 'absolute'. The last container
has four foreground images in boxes with borders on two sides, which are
positioned 'absolute'. The cursor will not become 'active' until it is hovered
over the border on any one of the images, and when it is moved out of the
immediate area of the holding container, it de-activates. I've tried removing
the float on the LH container, but then your code doesn't work at all.
The live site is at: www.allsaintshove.org with my altered code. Please
excuse the religious content, I'm working on the website as a favour. :-)
Regards,
Alan.
www.theatreorgans.co.uk
www.virtualtheatreorgans.com
Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups
Shopsmith 520 + bits
Flatulus Antiquitus
__
css-discuss [EMAIL PROTECTED]
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/
