[css-d] IE 67 Not responding to clears
I've looked all over for an answer, but I've had no luck so here's hoping you can help I'm working on a design for a client and for some reason the IE's won't expand with the content this time. I've done all kinds of layouts and I've tried all the solutions I can think of, but at this point I think I'm in too deep and I'm missing something. http://www.mindlike.net/Example/MockUp.html http://www.mindlike.net/Example/CSS/main.css Any help is appreciated __ 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] IE 67 Not responding to clears
Keith Fjellman wrote: I've looked all over for an answer, but I've had no luck so here's hoping you can help I'm working on a design for a client and for some reason the IE's won't expand with the content this time. I've done all kinds of layouts and I've tried all the solutions I can think of, but at this point I think I'm in too deep and I'm missing something. http://www.mindlike.net/Example/MockUp.html http://www.mindlike.net/Example/CSS/main.css Any help is appreciated Not quite sure what we're after? Could you clarify? The page looks pretty much the same in all my browsers-- compliant or not... -- A thin red line and a salmon-color ampersand forthcoming. http://chelseacreekstudio.com/ __ 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] IE 67 Not responding to clears
My apologies, I realized right after I sent it that I forgot to clarify. I really just need to make sure that none of the text at the bottom (primarily the lorem ipsum paragraph followed by ptest/p) crosses the yellow footer. The footer needs to clear like it does in FF or Chrome. On Tue, Mar 17, 2009 at 2:12 AM, David Laakso da...@chelseacreekstudio.comwrote: Keith Fjellman wrote: I've looked all over for an answer, but I've had no luck so here's hoping you can help I'm working on a design for a client and for some reason the IE's won't expand with the content this time. I've done all kinds of layouts and I've tried all the solutions I can think of, but at this point I think I'm in too deep and I'm missing something. http://www.mindlike.net/Example/MockUp.html http://www.mindlike.net/Example/CSS/main.css Any help is appreciated Not quite sure what we're after? Could you clarify? The page looks pretty much the same in all my browsers-- compliant or not... -- A thin red line and a salmon-color ampersand forthcoming. http://chelseacreekstudio.com/ __ 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] Layout still broken, new problems
hi kimi, IE6 e.g. does not recognize min-... (min-width). I think you designed on a fixed layout - so you can use simply width:780px in your body thats the first. If you got an Intel Mac I recommend to install virtualbox (www.virtualbox.org) and some windows environments for testing. otherwise you'll never see that what 80% others see :) ciaociao tina Von: Kim Brooks Wei kimi@kimbwei.com Datum: Tue, 17 Mar 2009 00:23:43 -0400 An: CSS-Discuss css-d@lists.css-discuss.org Betreff: [css-d] Layout still broken, new problems Hi there People, I got my site to look the way I wish it to on my own Mac in Safari and FF but the layout seems broken in other environments. A friend using IE and another using FF told me that my type sits on top of the tiger and can't be read. They are not seeing the layout the way I wish it to look. Look I want here http://thewei.com/sandbox/tw/test/ Look people are getting here http://thewei.com/sandbox/tw Help appreciated muchly. Cheers, Kimi -- This email sent by Kimi Wei 201-475-1854 | k...@thewei.com | thewei.com __ 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/ __ 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] Layout still broken, new problems
I think there's something called bootcamp and parallels too (sorry about the spelling, but if you google, it will correct itself) that should work on all MAC's. Regards, -- Krystian - Sunlust Affordable Web Services in Eastbourne: http://eastbournewebdesign.net Mobile UK (Orange): 07528 036 337 Call for more information or email me. __ 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] IE 67 Not responding to clears
Keith Fjellman wrote:
My apologies, I realized right after I sent it that I forgot to clarify.
I really just need to make sure that none of the text at the
bottom (primarily the lorem ipsum paragraph followed by ptest/p) crosses
the yellow footer.
The footer needs to clear like it does in FF or Chrome.
Hello Keith, change this series of CSS hacks.
*:first-child+html div#rightContent {
margin-left: 202px;
position: absolute;
z-index: 1;
clear: both;
}
* HTML div#rightContent {
margin-left: 202px;
position: absolute;
z-index: 1;
clear: both;
}
With these ones.
*:first-child+html div#rightContent {
margin-left: -202px; /*partially removed float*/
position: relative; /*stack element higher*/
}
* HTML div#rightContent {
margin-left: -202px; /*partially removed float*/
position: relative; /*stack element higher*/
}
What is happening is the div#leftContent was clearing the
div#rightContent since the declared *width* on div#leftContent was
triggering hasLayout [1].
1. http://www.satzansatz.de/cssd/onhavinglayout.html
--
Alan http://css-class.com/
Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
__
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] IE 67 Not responding to clears
That did it. I had a feeling I was dancing with that devil, but I couldn't
find the trigger.
Your help is greatly appreciated.
Thanks Alan!
On Tue, Mar 17, 2009 at 7:23 AM, Alan Gresley a...@css-class.com wrote:
Keith Fjellman wrote:
My apologies, I realized right after I sent it that I forgot to clarify.
I really just need to make sure that none of the text at the
bottom (primarily the lorem ipsum paragraph followed by ptest/p)
crosses
the yellow footer.
The footer needs to clear like it does in FF or Chrome.
Hello Keith, change this series of CSS hacks.
*:first-child+html div#rightContent {
margin-left: 202px;
position: absolute;
z-index: 1;
clear: both;
}
* HTML div#rightContent {
margin-left: 202px;
position: absolute;
z-index: 1;
clear: both;
}
With these ones.
*:first-child+html div#rightContent {
margin-left: -202px; /*partially removed float*/
position: relative; /*stack element higher*/
}
* HTML div#rightContent {
margin-left: -202px; /*partially removed float*/
position: relative; /*stack element higher*/
}
What is happening is the div#leftContent was clearing the div#rightContent
since the declared *width* on div#leftContent was triggering hasLayout [1].
1. http://www.satzansatz.de/cssd/onhavinglayout.html
--
Alan http://css-class.com/
Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
__
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] input type=image active area shift
Hey there! Tested IE6 and you are correct it works correctly. In FF3 I've noticed the #footer is overlapping the image buttons which prevents them for being clicked. Maybe its worth removing the float:right from the footer? Ta, MM On Mar 16, 2009 3:37pm, Ido dekkers idekkers@gmail.com wrote: Hi i have a strange problem with this site : http://test3.dekkers.net/marriage.html it's a site i inherited and need to fix. the problem is with the arrow buttons on the bottom: in IE all works fine, but in any standards compliant browser, the active area of the button seems not to be connected with the button itself? when i try to move the buttons down - the active area seems to stay in place, and only where the input still covers it - as soon as the input covers none of the active area the button stops working. in the current situation only the upper half of the button is clickable. I've tried every imaginable positioning technique - absolute, relative... none work, I've tried just for the test to add an input type=button - same problem... does anyone here have an idea ? thanks Ido __ 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/ __ 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/
[css-d] Extra spcae between columns in IE6
Hi all, I have a baffling problem with an unwanted space between columns in a three-column layout. I have made an example page here: http://www.tellura.co.uk/ruberyowen/index.htm I have 3 div elements, called navcolumn, content and sidebar. They are all floated left and I have defined the width. However, I have clearly done something wrong because the calculated widths throw column 3 down below the other 2. As a result, I have defined the width of the content div as much lower than it should be. IE6 respects that width but leaves a big gap at the right (if I float sidebar right then the gap is between content and sidebar). Safari and Firefox push the width out to fill all of the space. The table below shows the numbers: navcolumn content sidebar total calc width 258 405 287 950 set width in css 258 380 275 913 Browser measured width: Safari 259 411 276 946 FF 259 411 276 946 IE6 257 379 274 910 My question is, what am I missing in getting these three columns to float properly next to each other and use the space properly? The css is here: http://localhost/ruberyowen/css/styles.css The xhtml is here: http://localhost/ruberyowen/index.htm Anyway, any guidance would be appreciated. Ian. -- ianpi...@mac.com 07590 685840 | 01926 811383 __ 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] Extra spcae between columns in IE6
Ian Piper wrote:
I have a baffling problem with an unwanted space between columns in a
three-column layout. I have made an example page here:
http://www.tellura.co.uk/ruberyowen/index.htm
IE6 respects that width
but leaves a big gap at the right (if I float sidebar right then the
gap is between content and sidebar). Safari and Firefox push the width
out to fill all of the space.
http://localhost/ruberyowen/index.htm
Anyway, any guidance would be appreciated.
Ian.
--
Compliant bowsers, and even IE/7, include the #content horizontal
padding in the width calculation-- IE/6 dose not.
* html #content {width:410px;}
Aside: Interesting thread on font size over the past few days wasn't it
:-) ?
--
A thin red line and a salmon-color ampersand forthcoming.
http://chelseacreekstudio.com/
__
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] WAS : Size calculations
Ib Jensen wrote: And changing em to % is a good idea ?? A safer idea. Georg -- http://www.gunlaug.no __ 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/
[css-d] Styling fieldset legends
I have this basic code, with these basic styles. (sorry can't link the actual
example, because it's a log-in only site.)
formfield
legendIs the sky blue?/legend
input id=skyy name=sky type=radio/label for=skyyYes/label
input id=skyn name=sky type=radio/label for=skynNo/label
/formfield
formfield {
border: none;
padding: 0;
margin: 0;
}
legend {
padding: 0;
}
If you plug this basic example into a browser, you'll see that the legend text
has a different baseline than the label text (like it's superscripted or
something).
I'm trying to get the legend text to drop down to the same baseline as the
label text. But I have no idea how. Firebug isn't giving me any clues as to
the default style that makes it hang out up there anyway. So I'm not sure what
to set. Does anyone have any experience with this?
---Tim Climis
Computer Coordinator
International Services
__
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] Styling fieldset legends
Climis, Tim wrote: I'm trying to get the legend text to drop down to the same baseline as the label text. But I have no idea how. Firebug isn't giving me any clues as to the default style that makes it hang out up there anyway. So I'm not sure what to set. Does anyone have any experience with this? Legends are buggy to style in nearly all browsers. By default, they tend to sit vertically centered on the border of the fieldset element. Many styles simply won't work on the legend tag. For some real fun, try figuring out how to add x-browser-safe word wrapping to a long legend. The best advice I've seen is to replace the legend with a header tag and that tends to be the solution I employ as well. Approximate placement of the legend/fieldset relationship: +--[ LEGEND ]--+ | FIELDSET | | | +--+ Hope it helps. --Bill -- !-- ! Bill Brown macnim...@gmail.com ! Web Developologist, WebDevelopedia.com -- __ 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] input type=image active area shift
From: Ido dekkers idekkers@gmail.com
http://test3.dekkers.net/marriage.html
the problem is with the arrow buttons on the bottom:
in any standards compliant browser, the active
area of the button seems not to be connected with the button itself?
only the upper half of the button is clickable.
does anyone here have an idea ?
Yes. Try the following changes and see if it makes things work for you. Only
tried in FF, so no guarantees.
#content
{
float:right;
position:relative;
width:800px;
/* height:500px; */ /* remove */
margin:0;
padding:0;
}
#footer
{
float:right;
position:relative;
width:800px;
margin:-18px 0 0 0; /* change top value */
padding:0;
color:#000;
text-align:center;
font-size:12px;
}
~holly
__
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/
[css-d] Make layout more liquid?
Hi People, So, I finally seem to have worked out something with this layout. I've put the type into a resizeable div but it's not as liquid as I would like it to be: when I reduce the browser width the right side of the content div disappears. How could I make it scale better? Or can't I?\ http://thewei.com/sandbox/tw2 Thanks as always, Kimi -- This email sent by Kimi Wei 201-475-1854 | k...@thewei.com | thewei.com __ 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] Equal heights solutions
Nancy Johnson wrote: Hi, I just posted this got some wonderful answers, but I'm still looking for an ideal solution to equal heights problem Don't know about ideal -- but this is one CSS way of doing it: http://matthewjamestaylor.com/blog/perfect-multi-column-liquid-layouts (All the examples are based on the same double-wrapped column idea.) Cordially, David -- __ 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/
