Re: [css-d] Separate styles for IE6
Hi Jens, Thanks for your reply, I should have made myself clearer. I'm not sure the version of IE6 from http://tredosoft.com/Multiple_IE is behaving as IE6 completely. I think it is rendering as IE6, but not accepting the separate stylesheet I'm feeding it. The version of IE6 appears to be IE7, under HelpAbout. The problem I'm trying to resolve is that on http://www.jones-morris.co.uk/ I have created the site in FF, with fixed width and fixed header and navigation. I'm happy for the header and navigation to scroll in IE6. I IE6 the position of the content is bumped down much further than I want with codetop: 175px/code in the css applied to the main content div. , but trying to feed a separate stylesheet using; code !--[if IE 6] link href=styles/stylesIE.css rel=stylesheet type=text/css media=screen / ![endif]-- /code Is not feeding the separate stylesheet to the version of IE6 I have been using for testing. www.jones-morris.co.uk/styles/styles.css www.jones-morris.co.uk/styles/stylesIE.css Can anyone do a browser check on IE6 win for me as I don't think I'm seeing the results of the separate style I'm applying. Thanks, James __ 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] Separate styles for IE6
Silk-Works wrote:
I'm not sure the version of IE6 from http://tredosoft.com/Multiple_IE is
behaving as IE6 completely.
I think it is rendering as IE6, but not accepting the separate stylesheet
I'm feeding it. The version of IE6 appears to be IE7, under HelpAbout.
The problem I'm trying to resolve is that on
http://www.jones-morris.co.uk/
www.jones-morris.co.uk/styles/styles.css
www.jones-morris.co.uk/styles/stylesIE.css
James
I think you /are/ getting IE 6 with the multiple install of IE, and it
is not working as you intend in IE 6 on this end or your end.
I am not sure-- try:
!--[if lt IE 7]
style
* html #foo{ position: static; }
* html #foobah { top: 0; }
/style
![endif]--
Precede the selectors with the star hack. And only target the particular
selector rule (s) that needs to be different for IE 6 and down. Enclose
these selectors in a less than version 7 CC (to test-- feed them from an
external style sheet in the final version).
Best,
~dL
--
http://chelseacreekstudio.com/
__
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] background image not aligning
Hi Jeff,
Add the following to your CSS:
#secondaryNav li a {
display:block;
}
Hey Mauricio,
That worked perfectly. Thanks for the help!
Jeff
__
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] page loading in 2 visible steps
I'm having a problem with my pages loading at my new ISP (BlueHost). They tell me the problem is not on their end, that it is a coding problem. I've checked at home and at work and I'm seeing the problem both places: The pages load in the browser (the first time) in TWO steps (sort of ba-dink): Step 1: the content (without styling) Step 2: then, a second later, the styling is applied and the background image in the case of the main page appears. The first step can display for as long as a second or two. The sylesheet is @import. Is this something I need to tweak or do they? Here a link to view and thanks for your advice: http://www.kdwebstudio.com __ 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] page loading in 2 visible steps
The first step can display for as long as a second or two. The sylesheet is @import. Is this something I need to tweak or do they? This is something you can fix. It is known as the Flash of Unstyled Content (FOUC). You can find out more about it at http://www.bluerobot.com/web/css/fouc.asp/. Basically the easiest solution is to scrap the @import and use LINK elements to reference your stylesheets. -- Australian Web Designer - http://www.blakehaswell.com/ __ 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] page loading in 2 visible steps
[EMAIL PROTECTED] wrote: I'm having a problem with my pages loading at my new ISP (BlueHost). They tell me the problem is not on their end, that it is a coding problem. I've checked at home and at work and I'm seeing the problem both places: The pages load in the browser (the first time) in TWO steps (sort of ba-dink): Step 1: the content (without styling) Step 2: then, a second later, the styling is applied and the background image in the case of the main page appears. The first step can display for as long as a second or two. The sylesheet is @import. Is this something I need to tweak or do they? I'm not seeing your issue, but I'm kinda sluggish today. I might have missed it. You do, however, have a few markup and css errors. http://validator.w3.org/check?uri=http://www.kdwebstudio.com http://jigsaw.w3.org/css-validator/validator?uri=http://www.kdwebstudio.com Might try fixing those, then let us know if it is still ba-dink-ing nat __ 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] page loading in 2 visible steps
Quoting Blake Haswell [EMAIL PROTECTED]: The first step can display for as long as a second or two. The sylesheet is @import. Is this something I need to tweak or do they? This is something you can fix. It is known as the Flash of Unstyled Content (FOUC). You can find out more about it at http://www.bluerobot.com/web/css/fouc.asp/. Basically the easiest solution is to scrap the @import and use LINK elements to reference your stylesheets. Thanks very much, Blake! That's *really* helpful info. It will no doubt save me hours and a lot of wasted thought. __ 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] problem with vertical nav list
[EMAIL PROTECTED] wrote: Hello, Maybe someone can help me out here. I've been working with a vertical list to create a menu using this: http://css.maxdesign.com.au/listamatic2/vertical02.htm# http://css.maxdesign.com.au/listamatic2/vertical02.htm as my example. That particular list appears as it should in my IE7 browser. However, MY list is adding a 1px margin to the li elements, even when I have specifically said I want the margin to be 0. This occurs in IE7 and IE6. Needless to say it appears as it should in Mozilla based browsers. You can see my list here: http://www.tibbits.ca/test/index2.php Could someone explain where this margin is coming from and how I can fix it? Thank you, Matt Tibbits No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.5.467 / Virus Database: 269.6.2/787 - Release Date: 5/3/2007 2:11 PM __ 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/ Have you tried removing the whitespace in your list? IE is very picky about that sorta thing :) -- Thanks, Jim __ 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] Random extra space
Hi all, I'm trying to make a box with rounded corners by using images for the top and bottom edges, but I'm getting big gaps between the images and the div they surround. Check out http://www.relaxshiatsu.co.uk/ to see what I mean. The HTML looks like this: div id=top/div div id=content !-- stuff goes here -- /div div id=bottom/div The top and bottom divs are where the images are (in CSS). Weirdly, the space is only present if I have block-level markup like p in the content div -- the space disappears if I just have this: div id=content blah blah blah /div It's as though the p's margin has extended beyond the div it's in. But that doesn't happen, right? Oh, I'm using Firefox 1.5.0.10 on Fedora Core 5. Thanks in advance, Gary __ 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] DIVs height is wrong in IE
Christian Kirchhoff wrote: Hallo, please take a look at the following example: http://www.digitale-bibliothek.de/downloads/test/test.htm The basic layout is: - one top DIVused as a header and one main DIV - both DIVs have a three column layout, left column float:left, right column float:right, the center column has margins that each equal the overall width of either the left ar the right column. - The middle column DIVs have a min-width defined. - The middle and right DIV of the main area each have margin-bottom: -32767px and padding-bottom: 32767px in order to drag down their background color. There is a box with some links in the lower right area, under the google ad box. This box seems to be cut in IE 7, because the containing DIVs height is somehow computed worng. The overflow of that containing DIV is set to hidden. If I set it to auto, scroll bars appear as expected. If I set it to visible, it seems to show the same result as hidden. I guess it the problem is connected to the fact that I set the height of the html and the body element to 100%. But if I wouldn't do that, in IE7 the right column DIV would be cut even earlier, even if I set it's overflow to visible. Does anybody know how to correct this? Any hint would be appreciated. Best regards, Christian Kirchhoff Directmedia Publishing GmbH · Möckernstraße 68 · 10965 Berlin www.digitale-bibliothek.de AG Berlin-Charlottenburg · HR B 58002 · USt.Id. DE173211737 Geschäftsführer: Ralf Szymanski · Erwin Jurschitza __ 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/ If you place overflow: scroll on the body tag of your document you'll see why IE is doing the voodoo that it do(es) so well. Don't have any advice for you to help you correct it though... If you're just wanting all the sections to be be '100%' of the height for your backgrounds, perhaps you should consider utilizing a 'faux column' technique? Also, when I ran your page through the validator you have a h2 and p tag inside of an anchor tag. -- Thanks, Jim __ 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] is it possible to get A:focus working in IE?
Sandy wrote: Hello All, Is it possible to get A:focus working in IE? I have done a little research, and found lots of people saying that IE doesn't support focus. Is there some kind of work around? thanks! Sandy __ 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/ The only work arounds I know are javascript (which can be disabled) and behaviours (which I've not yet attempted to learn). Unless someone here knows another way there are no known CSS only workarounds. -- Thanks, Jim __ 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] Pages on IE look different locally and live
Hi, I've built my first full site in CSS and when I test the pages on my desktop, the margins are different from the live version. Only happens on IE6 and 7 and totally fine on Firefox and Opera. I've tested on other machines and the live page looks like my local page. I'm confused. Is there a reason why my local PC would render CSS differently from the live website? Thanks Stewart Stewart Pleace Bunnyfoot __ 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] Please check out my site
This is my first attempt at going tableless. Here is a link to my site http://www.precisemessenger.com/private/help1.html 1. The left menu disappears when the browser is resized smaller in ff. 2. The title and subtitle text scrunches up when the browser is resized smaller in ff. 3. Everything becomes blue when the browser is resized smaller in ie6 or 7 4. Thumbnail image hover outline not working in ie6. Any suggestions to fix these problems or design ideas are greatly appreciated. Thanks, Kevin __ 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 issue?
Hello,
I am having a layout problem with IE6 which does not appear in IE7 or Firefox.
http://www.ilsleypubliclibrary.org/databases/index_minimum.html
The CSS is at:
http://www.ilsleypubliclibrary.org/style_minimum.css The problem disappears
when I replace
#content {
position:relative;
width:580px;
left:50%;
margin-left:-290px;
padding:0px;
margin-top:5px;
text-align:left;
}
with
#content {
the margin-left:108px;
}
Thank you for the help.
Chris
-
Ahhh...imagining that irresistible new car smell?
Check outnew cars at Yahoo! Autos.
__
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] Annoying spaces (Linux browsers)
Hey Folks, I'm facing a little problem in this menu. Well, I tried to solve this by myself, but I have no success : ( This menu works fine on Windows (IE and Firefox) but whenever I run it on Linux I can see a very small (but annoying) space bellow the menu. Anybody know what's going ? Check the link please: http://www.brasilfmx.com/principal.htm Thanks, JS __ 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] Picture Position troubles
I have a dog on our website that does not stay put. Depending on which browser you are using it will move. The dogs leg will cover links on our menu that makes it difficult to click the links. It appears on every page in our website aside from the homepage. Here is a link to one of the pages: http://www.coastalpet.com/aboutus.php. You'll find the dog on about the 21st line with the div id layer1. The line also includes the styling. If you need to see the rest of the css, you can see that at: http://www.coastalpet.com/blu.css Is there a way to make the dog stay in a consistent spot on the site without making it apart of the background image? Thanks, Jason Peterman Webmaster Assistant Coastal Pet Products www.coastalpet.com __ 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] page loading in 2 visible steps
I didn't see any problem at all when viewing the page... [EMAIL PROTECTED] wrote: I'm having a problem with my pages loading at my new ISP (BlueHost). They tell me the problem is not on their end, that it is a coding problem. I've checked at home and at work and I'm seeing the problem both places: The pages load in the browser (the first time) in TWO steps (sort of ba-dink): Step 1: the content (without styling) Step 2: then, a second later, the styling is applied and the background image in the case of the main page appears. The first step can display for as long as a second or two. The sylesheet is @import. Is this something I need to tweak or do they? Here a link to view and thanks for your advice: http://www.kdwebstudio.com __ 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/ -- Thanks, Jim __ 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] % Height attribute not applying to Flash
Does anyone know how to apply a height to a flash object? For some
reason when you set the height as a percentage, it is not applied to the
flash object, but if I set the height using any other units (px, em,
etc.) it is applied correctly. I've looked around for answers but all
I've been able to see is how to make a flash play 100% of window height
(not what I'm trying to do) and how to make css work IN flash.
Here is the relevant section of my code:
#flashContent
{
width: 100%;
height: 30.833%;
max-width: 858px;
max-height: 276px;
}
#flashContent object, #flashContent embed
{
width: 99.3006993%;
height: 97.8260869%;
max-width: 852px;
max-height: 270px;
}
div id=flashContent
object
codebase=http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,22,0;
param name=movie value=flashcontent.swf /
param name=bgcolor value=#ff /
param name=quality value=best /
embed pluginspage=http://www.macromedia.com/go/getflashplayer;
src=flashcontent.swf bgcolor=#ff quality=best /
/object
/div
--
Thanks,
Jim
__
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] [Question] IE spacing issues
Hello all! I'm trying to do a layout totally in CSS, and I have come almost to the end of the project without any major problems. I'm noticing a couple of DIVs are adding space at the bottom under the content - only in IE, and not in Mozilla. What is doing this? I can't imagine why it would be adding space under an image or a search bar. Any and all help is greatly appreciated :-) The page: http://chessys.isg.syssrc.com/products_services/products.htm The CSS: http://chessys.isg.syssrc.com/chessys.css -- Melissa Carraway 410.771.5544 x4434 [EMAIL PROTECTED] www.syssrc.com __ 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 inheritance issue
I'm having trouble with, I think, an inheritance issue with IE6.
In the following html, I create buttons out of two spans, style them
differently and use a script to activate them.
Firefox agrees with me that the buttons should have different .up,
.over, and .down styles, but IE6 does not. It seems to be applying only
the last styles listed to both buttons.
Can anyone explain how to get IE to see the differences in the span
classnames?
Thanks!
!--?xml version=1.0 encoding=ISO-8859-1?--
!DOCTYPE html
PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html
head
titleButton Test/title
style
.type2
{
cursor:hand; cursor:pointer;
font: bold 11.5px Tahoma;
white-space:nowrap;
margin:0 .25em 0 0;
text-align:center;
display:inline;
vertical-align:middle;
padding: 4px 3px 4px 20px;
border-width: 1px;
border-style: solid;
}
.type2.up
{
color: rgb(0,0,0);
background-color: rgb(255,255,255);
border-color:rgb(255,255,255);
}
.type2.over
{
color: rgb(0,0,0);
background-color: rgb(255,255,255);
border-left-color: rgb(204,204,204);
border-top-color: rgb(204,204,204);
border-right-color: rgb(102,102,102);
border-bottom-color: rgb(102,102,102);
}
.type2.down
{
color: rgb(0,0,0);
background-color: rgb(230,230,230);
border-right-color: rgb(204,204,204);
border-bottom-color: rgb(204,204,204);
border-left-color: rgb(102,102,102);
border-top-color: rgb(102,102,102);
}
.type1
{
cursor:hand; cursor:pointer;
font: bold 11.5px Tahoma;
white-space:nowrap;
margin:2px;
width:6em;
text-align:center;
display:inline;
vertical-align:middle;
padding: 2px 3px;
border: 1px solid black;
}
.type1.up
{
color: rgb(0,0,0);
background-color: rgb(255,255,255);
border-color: rgb(0,0,0);
}
.type1.over
{
color: rgb(0,0,0);
background-color: rgb(240,240,240);
border-color: rgb(204,102,0);
}
.type1.down
{
color: rgb(0,0,0);
background-color: rgb(192,192,192);
border-color: rgb(204,102,0);
}
/style
/head
body
span class=button type1 upView/span
span class=button type2 upProfiles/span
script
function addButtonHandlers(whichTag) {
var isAButton = new Array();
var couldBeAButton = document.getElementsByTagName(whichTag);
for (var i = 0; i couldBeAButton.length; i++) {
if(couldBeAButton[i].className.search(sticky) == -1) {
if (couldBeAButton[i].className.search(button) != -1) {
couldBeAButton[i].onmouseover = function() {
this.className = this.className.replace(up,over);
return false;
}
couldBeAButton[i].onmousedown = function() {
if(this.className.search(over) != -1) {
this.className = this.className.replace(over,down);
}
if(this.className.search(up) != -1) {
this.className = this.className.replace(up,down);
}
return false;
}
couldBeAButton[i].onmouseup = function() {
this.className = this.className.replace(down,up);
return false;
}
couldBeAButton[i].onmouseout = function() {
if(this.className.search(over) != -1) {
this.className = this.className.replace(over,up);
}
if(this.className.search(down) != -1) {
this.className = this.className.replace(down,up);
}
return false;
}
}
}
}
}
window.onload = function() {
addButtonHandlers(span);
}
/script
/body
/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] [Question] IE spacing issues
Melissa Carraway wrote: I'm noticing a couple of DIVs are adding space at the bottom under the content - only in IE, and not in Mozilla. http://chessys.isg.syssrc.com/products_services/products.htm http://chessys.isg.syssrc.com/chessys.css Melissa Carraway Correct the 85 markup validation errors and please bring it back to the list if you still have the same (or different ) problem(s). Best, ~dL -- http://chelseacreekstudio.com/ __ 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] [Question] IE spacing issues
*-Original Message-
*From: Melissa Carraway
*Sent: Monday, May 07, 2007 10:53 AM
*
*I'm noticing a couple of DIVs are adding space at the bottom under the
*content - only in IE, and not in Mozilla.
*
*What is doing this? I can't imagine why it would be adding space under
*an image or a search bar.
I think that's actually vertical spacing before and after your form,
which is built into the form element (I think it's about 1.3ems). If you
remove all your padding on the colordiv, the form spacing collapses for
some strange reason. Even 1px causes the same bloat. (I may not have all
the facts straight here, forgive me if I'm spreading misinformation!)
But I do know It works if you change your code to this:
#colordiv1 {
PADDING:5px; BACKGROUND: #e4e4e4; margin:0;
}
form { display:inline; margin:0; }
or this:
#colordiv1 {
PADDING:0; BACKGROUND: #e4e4e4; margin:0;
}
form { margin:0; padding:5px;}
Cheers,
Teressa Terry
__
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] Document order versus design breakpoint
Dave M G wrote: In the current layout, the menu has an absolute position, and is oriented to the top right of the viewport. If the viewport is shrunk to below 500 pixels, the layout breaks. I tried setting a minimum width on the body tag, but this has no influence over an item that is absolutely positioned to the right. As the page is shrunk, all relatively positioned objects stop moving, but the absolutely positioned objects will continue to place themselves in absolute terms from the viewport boundaries. Which, of course, is the expected behavior. As far as I can understand it, my only choice to make the menu obey the min-width of the body is to make it relatively positioned. Applying max-width: 100% to the navigation div will restrict it to be no wider than the body, even when absolutely positioned. (You'll need appropriate hackery to work this in IE7). Your menu will then grow vertically, which may cause it to overlap the content beneath it. You could restrict it's height, and apply overflow: hidden so it can't mask your content, but this would mean part of the menu was no longer visible. You might, however, be able to do something clever with javascript to detect the menu's height and adjust the top position/margin of your content accordingly, which would keep the menu accessible to 90+% of your audience. However I'm no JS expert so can't help you with how that might be done ;-) But surely it's quite common to want a menu on the top right in the design, and near the end of the HTML. While it's common and relatively easy to move a menu around this way when it's going to be positioned to the left (you'll get a horizontal scrollbar at small viewport sizes), as you've found positioning it to the right, while keeping it accessible at smaller viewport sizes, is more tricky! -- Sophie Dennis, Creative Director Cayenne Web Development Limited www.cayenne.co.uk Bloxham Mill, Barford Road Bloxham, Oxfordshire OX15 4FF t. 0870 389 0570 m: 07814 026632 Reg. England and Wales no. 4502369 __ 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] Picture Position troubles
[EMAIL PROTECTED] wrote:
http://www.coastalpet.com/aboutus.php.
Is there a way to make the dog stay in a consistent spot on the site
without making it apart of the background image?
Yes.
Now the dog is absolute positioned relative to the browser-window.
You must instead absolute position the dog relative to the page-container.
Step 1: move the div containing the dog-image inside div
id=container in the source-code.
Step 2: add...
#container {position: relative;}
...to create a relation.
Step 3: change the left and top values to where you want the dog to
stay. Put the styles in the stylesheet,and delete the inline styles.
The dog will stay put :-)
In addition: add the following...
#nav-meta {display: inline;}
...to kill the 'margin-doubling on floats' bug in IE6.
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/
Re: [css-d] Picture Position troubles
I have a dog on our website that does not stay put. Depending on which browser you are using it will move. The dogs leg will cover links on our menu that makes it difficult to click the links. It appears on every page in our website aside from the homepage. Here is a link to one of the pages: http://www.coastalpet.com/aboutus.php. -- Hi Jason, The div#Layer1 is absolutely positioned. The origin (base context) for elements with position:absolute is the ancestor element positioned othe than static. If there isn't such element the origin is the BODY element (this is your markup case). Note that resizing the window the dog remains at 731px from left and 46px from top. The cure is: 1-) Put the div#Layer1 inside the div#container; 2-) Add position:relative in #container CSS rules; (the new positioning context) 3-) Change to left: 490px; top: 25px; (or choose another position) the inline CSS styles for div#Layer1. (I suggest get rid of the inline styles for div#Layerq and put it in the CSS style sheet) Making the Absolute, Relative: http://www.stopdesign.com/articles/absolute/ Regards Maurício Samy Silva http://www.maujor.com/ __ 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] help with content column dropping down in IE6
I am having difficulty with IE6 (again). The problem is on this page
http://www.cassell.com/draft/tandem/CSS_Design/index.html
http://www.cassell.com/draft/tandem/CSS_Design/site.css
In ie 6 #maincol.narrow wants to drop down no matter what I try.I tried
adjusting the widths, margin etc. I have written specific styles for IE6
only, but nothing I try has worked.
I even tried this hack and designated in an IE6 only stylesheet:
* html #InnerContainer {
overflow-x: auto; overflow-y: hidden;
width: expression(660);
}
no luck...
any help is appreciated!
--
::Bruce::
__
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] Image Placement
Try, background-position: center center; Regards,Ernie. From: Steve LaBadie [EMAIL PROTECTED] To: css-d@lists.css-discuss.org Subject: [css-d] Image Placement Date: Mon, 7 May 2007 15:06:01 -0400 I have an image set to align=middle, but aligns on the bottom of the cell in Firefox. How can I correct this? Steve LaBadie, Web Manager East Stroudsburg University 200 Prospect St. East Stroudsburg, Pa 18301 570-422-3999 [EMAIL PROTECTED] mailto:[EMAIL PROTECTED] http://www.esu.edu http://www3.esu.edu __ 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/ _ Download Messenger. Join the im Initiative. Help make a difference today. http://im.live.com/messenger/im/home/?source=TAGHM_APR07 __ 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] Different stylesheets for IE6
I have two separate stylesheets - one that works fine in IE6, and one that works fine in everything else! The primary page: http://198.104.158.65/homepage4_R.htm and the stylesheet: http://198.104.158.65/css/frontpage4.css The page that works OK in IE6: http://198.104.158.65/homepage_IE4.htm and its stylesheet: http://198.104.158.65/css/frontpage_IE4.css I've tried using the import code in this page: http://198.104.158.65/homepage_IE4_import.htm but it breaks the page in IE horribly. I've also tried the * html hack by including all of the IE-specific defintions in my main stylesheet with * html prefacing them - - again, no luck. I'm not sure what I'm doing wrong? Anne [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] Different stylesheets for IE6
Anne E. Shroeder wrote:
I've tried using the import code in this page:
http://198.104.158.65/homepage_IE4_import.htm
but it breaks the page in IE horribly. I've also tried the * html hack by
including all of the IE-specific defintions in my main stylesheet with *
html prefacing them - - again, no luck. I'm not sure what I'm doing wrong?
Overstyling, I think.
You can dump the IE6 specific stylesheet, as all IE6 needs in addition
to the regular stylesheet is...
* html #main div {
overflow: hidden;
}
#fp_column3_bottom_right {
margin-top: -6px;
position: relative;
float: right;
}
Note that the design breaks in every css capable browser on earth if any
degree of font-resizing is applied. A bit more testing and redesigning
is necessary if you want your design to survive.
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/
Re: [css-d] Browser Check Please
Hi On 04/05/07, Richard Brown [EMAIL PROTECTED] wrote: http://www.stwinnowceschool.info/ http://www.stwinnowceschool.info/wp-content/themes/iconschool/style.css I know the site needs some more styling work but does it work in WinIE please? Particularly the drop down menu and three column elements. After the previous site checks, I have changed the site design (made it simpler). However, when I look at the site in WinIE 5.5 an d 6.0 the yellow rounded corner background gains a huge yellow square on the right hand side. Can anybody tell me why please? Thanks. -- Rich http://www.cregy.co.uk Embracing what God does for you is the best thing you can do for him. Romans 12 v 1 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d 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] Different stylesheets for IE6
On 2007/05/08 06:26 (GMT+0200) Gunlaug Sørtun apparently typed:
Anne E. Shroeder wrote:
I've tried using the import code in this page:
http://198.104.158.65/homepage_IE4_import.htm
but it breaks the page in IE horribly. I've also tried the * html hack by
including all of the IE-specific defintions in my main stylesheet with *
html prefacing them - - again, no luck. I'm not sure what I'm doing wrong?
Note that the design breaks in every css capable browser on earth if any
degree of font-resizing is applied. A bit more testing and redesigning
is necessary if you want your design to survive.
Note too that *re*-sizing fonts is not required for it to break. It's broken
on arrival for me on all browsers I viewed it with (IE6, FF, SM, Opera,
Konq). This is normal for sites that set 'body {font-size: 62.5%}'.
--
The path of the righteous is like the first gleam of dawn, shining
ever brighter till the full light of day. Proverbs 4:18 NIV
Team OS/2 ** Reg. Linux User #211409
Felix Miata *** http://mrmazda.no-ip.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
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/
