[css-d] IE moving content
Hi everyone I've hit a problem with a web site moving the content of the main body down the page by about 65px. I have a main css and an ie specific (hacks) css file, but nothing seems to fix the issue. I am using the Son of Suckerfish to get the rollowvers on the menu. See the problem in IE ONLY at http://it.swantafe.wa.edu.au - and fee free to let me know how bad it is [LOL]. Thanks Ady Adrian Gould Lecturer in Information Technology Business, Finance and Computing PO BOX 1336, Midland WA 6936 Ph: +61-8-9374 6378 Fx: +61-8-9374 6375 Web: www.swantafe.wa.edu.au Content of this may eMail may not reflect the author or college's viewpoint: Never clean your room while your plane ticket is in it. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] [ADMIN - OFF TOPIC] Re: Somewhat off-topic
OMG! Lol! Nce, thanks for sharing. :D Actually, thanks for not sharing. There are plenty of place on the interweb to find and exchange such things but this list isn't one of them. Alex the humourless css-d moderator __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] [ADMIN - OFF TOPIC] Re: The best way to create the site map
At 06:10 +0200 22/6/06, Igor wrote: Hi everybody! What is the best way to create the site map? The best way is to ask on a list that deals with general issues of web development, not one focused on the practical use of CSS. Just to be clear, creating a site map has nothing to do with CSS and consequently no place on this list. http://css-discuss.incutio.com/?page=OffTopic http://css-discuss.incutio.com/?page=PostingGuidelines If, once you have figured out how to create your site map, you have questions that relate to styling it, please don't hesitate to post such questions to the list. Alex css-d moderator __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE moving content
Gould, Adrian wrote:
See the problem in IE ONLY at http://it.swantafe.wa.edu.au - and fee
free to let me know how bad it is [LOL].
Basic problem seems to be related to nav-list dropdown affecting
container-height.
One way to fix it - in the source-code...
/ul
br style=clear: both; / !-- add this clearer right here --
/div
/div
div id=mainBody
I didn't bother to look for the exact bug. IE have several bugs related
to 'positioning', that can be fixed by a *solid* separator/clearer.
---
You have clearly not tested with any font-resizing option in any
browser, so it is bad... :-)
1: You have triggered the em font-resizing bug in IE/win...
http://www.gunlaug.no/contents/wd_additions_13.html
Add...
html {font-size: 100%;}
...to fix that.
2: Footer can't expand with font-resizing (except in IE, of course).
Add...
#footer {display: table;}
...to avoid overflow in Opera, Firefox etc.
3: Repetitive use of h1 in a page isn't regarded as proper.
At least, give the h1 in mainBody a decent line-height, to avoid
overlapping if/when it wraps into two (or more) lines.
The rest... ...doesn't look too bad... ;-)
regards
Georg
--
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] IE 6 postion:absolute problem
Hi list, I've searched for this error in the wiki and couldn't find any specific information about this. I have this page: http://work.grillo.tk/vilarigno/home.html and IE 6 isn't respecting the position:absolute of the badge... it works fine in FF and IE 7. Can someone take a look a share any clue why this is happening ? TIA Grillo __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE 6 postion:absolute problem
Hi Grillo, Try validating your page - I had a similar problem recently and when I ran a validator (an extension to FF, btw) I found a couple of things that were fixed and the page worked in IE. HTH, Riva Marcelo Wolfgang wrote: Hi list, I've searched for this error in the wiki and couldn't find any specific information about this. I have this page: http://work.grillo.tk/vilarigno/home.html and IE 6 isn't respecting the position:absolute of the badge... it works fine in FF and IE 7. Can someone take a look a share any clue why this is happening ? TIA Grillo __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE 6 postion:absolute problem
Hi, Just went through the xhtml and css validators on w3c and the only errors pointed out in the css is the star hack nothing more ... still the position:absolute error persists. On 6/22/06, Portman [EMAIL PROTECTED] wrote: Hi Grillo, Try validating your page - I had a similar problem recently and when I ran a validator (an extension to FF, btw) I found a couple of things that were fixed and the page worked in IE. HTH, Riva Marcelo Wolfgang wrote: Hi list, I've searched for this error in the wiki and couldn't find any specific information about this. I have this page: http://work.grillo.tk/vilarigno/home.html and IE 6 isn't respecting the position:absolute of the badge... it works fine in FF and IE 7. Can someone take a look a share any clue why this is happening ? TIA Grillo __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE 6 postion:absolute problem
Actually, just got worse .. the badge isn't displaying anymore ... All the change I did was to move a form tag before of a div because the validation was saying it wasn't closed ... weird On 6/22/06, Marcelo Wolfgang [EMAIL PROTECTED] wrote: Hi, Just went through the xhtml and css validators on w3c and the only errors pointed out in the css is the star hack nothing more ... still the position:absolute error persists. On 6/22/06, Portman [EMAIL PROTECTED] wrote: Hi Grillo, Try validating your page - I had a similar problem recently and when I ran a validator (an extension to FF, btw) I found a couple of things that were fixed and the page worked in IE. HTH, Riva Marcelo Wolfgang wrote: Hi list, I've searched for this error in the wiki and couldn't find any specific information about this. I have this page: http://work.grillo.tk/vilarigno/home.html and IE 6 isn't respecting the position:absolute of the badge... it works fine in FF and IE 7. Can someone take a look a share any clue why this is happening ? TIA Grillo __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE 6 postion:absolute problem
Actually, just got worse .. the badge isn't displaying anymore ... Two things strike me here - position:absolute if removed, image becomes visible but also the image itself is not wrapped in any div line 152 you have div id=c_flash/div, if you remove /div and put that after the c_badge div it might help Ian -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.394 / Virus Database: 268.9.2/370 - Release Date: 20/06/2006 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE 6 postion:absolute problem
Ok, I'm becoming more lost, and really hating IE 6 !!! I did what you told me, well it worked . The right side panel, was pushed to the bottom of the div, and even if I increase the width of the div it won't go to the top anymore. Also if I give him a border: 1px solid black attribute the div is on the right side, if I remove the border, the div is on the left side ... check out at: http://work.grillo.tk/vilarigno/html/home_ienoborder.html and file:///F:/My%20Works/vilarigno/html/home_ieborder.html I really don't get what's happening here. Please help (and if someone has any tip why the sleight.js - to do the png transparency stopped working, I appreciate ) Grillo On 6/22/06, Ian Young [EMAIL PROTECTED] wrote: Actually, just got worse .. the badge isn't displaying anymore ... Two things strike me here - position:absolute if removed, image becomes visible but also the image itself is not wrapped in any div line 152 you have div id=c_flash/div, if you remove /div and put that after the c_badge div it might help Ian -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.394 / Virus Database: 268.9.2/370 - Release Date: 20/06/2006 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE 6 postion:absolute problem
sorry, the correct adresses are: http://work.grillo.tk/vilarigno/home_ienoborder.html http://work.grillo.tk/vilarigno/home_ieborder.html Also with no border the badge won't shows up ... On 6/22/06, Marcelo Wolfgang [EMAIL PROTECTED] wrote: Ok, I'm becoming more lost, and really hating IE 6 !!! I did what you told me, well it worked . The right side panel, was pushed to the bottom of the div, and even if I increase the width of the div it won't go to the top anymore. Also if I give him a border: 1px solid black attribute the div is on the right side, if I remove the border, the div is on the left side ... check out at: http://work.grillo.tk/vilarigno/html/home_ienoborder.html and file:///F:/My%20Works/vilarigno/html/home_ieborder.html I really don't get what's happening here. Please help (and if someone has any tip why the sleight.js - to do the png transparency stopped working, I appreciate ) Grillo On 6/22/06, Ian Young [EMAIL PROTECTED] wrote: Actually, just got worse .. the badge isn't displaying anymore ... Two things strike me here - position:absolute if removed, image becomes visible but also the image itself is not wrapped in any div line 152 you have div id=c_flash/div, if you remove /div and put that after the c_badge div it might help Ian -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.394 / Virus Database: 268.9.2/370 - Release Date: 20/06/2006 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE 6 postion:absolute problem
YES YES happy happy joy joy. Thanks Ian, your tip started the fix .. I finally fixed IE, and after broken FF I fixed it too. Now I have only 1 more IE quirk to fix in a similar page ... Thanks again for all the help On 6/22/06, Marcelo Wolfgang [EMAIL PROTECTED] wrote: sorry, the correct adresses are: http://work.grillo.tk/vilarigno/home_ienoborder.html http://work.grillo.tk/vilarigno/home_ieborder.html Also with no border the badge won't shows up ... On 6/22/06, Marcelo Wolfgang [EMAIL PROTECTED] wrote: Ok, I'm becoming more lost, and really hating IE 6 !!! I did what you told me, well it worked . The right side panel, was pushed to the bottom of the div, and even if I increase the width of the div it won't go to the top anymore. Also if I give him a border: 1px solid black attribute the div is on the right side, if I remove the border, the div is on the left side ... check out at: http://work.grillo.tk/vilarigno/html/home_ienoborder.html and file:///F:/My%20Works/vilarigno/html/home_ieborder.html I really don't get what's happening here. Please help (and if someone has any tip why the sleight.js - to do the png transparency stopped working, I appreciate ) Grillo On 6/22/06, Ian Young [EMAIL PROTECTED] wrote: Actually, just got worse .. the badge isn't displaying anymore ... Two things strike me here - position:absolute if removed, image becomes visible but also the image itself is not wrapped in any div line 152 you have div id=c_flash/div, if you remove /div and put that after the c_badge div it might help Ian -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.394 / Virus Database: 268.9.2/370 - Release Date: 20/06/2006 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] horisontal nav-list not in ie
I'm having a problem with a nav-list not rendering horisontal in IE5.x and
7b2. (I don't have IE6 anymore thanks to IE7 :/ )
Using sliding doors expands the li's to the full width of the parent
element, which I believe they shouldn't. I'm using typical markup:
ul id=tabs
lialink 1/a/li
.
.
/ul
with css:
ul#tabs {
list-style-type: none;
margin: 0;
padding: 0;
float: left;
}
ul#tabs li {
float: left;
background: url(/Media/Common/Tabs/left_inactive.gif) no-repeat top
left;
margin: 0 2px 0 0;
padding: 0 0 0 5px;
}
ul#tabs li a {
display: block;
float: left;
font-size: 14px;
height: 20px;
color: #fff;
text-decoration: none;
background: url(/Media/Common/Tabs/right_inactive.gif) top right
no-repeat;
padding: 0 10px 0 5px;
}
Sorry for not linking to the site, but the server is closed for out-of-house
connections.
Eystein
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] background
I believe the problem is that you are trying to use a png. Try using a
.gif or .jpg instead. IE doesn't make friends with .png's I find.
Hope this helps!
- Lacuna
--
Message: 2
Date: Wed, 21 Jun 2006 17:22:31 -0700 (PDT)
From: Mike Tuller [EMAIL PROTECTED]
Subject: [css-d] background
To: css-d@lists.css-discuss.org
Message-ID: [EMAIL PROTECTED]
Content-Type: text/plain; charset=iso-8859-1
I have a column that I am trying to fill the
background with an image, but I can't get it to work
right. Here is the css for that column.
#middleColumn
{
position: absolute;
top: 45px;
left: 3%;
height: 100%;
width: 800px;
background: url(../images/middleWhiteBg.png)
repeat-y;
}
In Firefox the background displays correctly except on
one page
http://www.mplsfarmersmarket.com/beta/history.html
where the background stops repeating, but in IE 6, the
background doesn't repeat at all it seems. I can set
the height at 1000px, but then there is extra space on
short pages, and on long ones you are limited to
space.
Does someone have a better way to get the background
image to repeat so that the it fills the whole page in
both IE and Firefox?
Thanks,
Mike
**
This message and any attachments should only be read by those persons to whom
it is addressed and be used by them for its intended purpose. It must not
otherwise be reproduced, modified, distributed, published or actioned. If you
have received this e-mail in error, please notify us immediately by telephone
on 01202 237000 and delete it from your computer immediately. This e-mail
address must not be passed to any third party or be used for any other purpose.
Every reasonable precaution has been taken to ensure that this e-mail,
including attachments, does not contain any viruses. However, no liability can
be accepted for any damage sustained as a result of such viruses, and
recipients are advised to carry out their own checks.
Moov2 Ltd cannot accept liability for statements made which are clearly the
senders own and not made on behalf of the Moov2 Ltd. An e-mail reply to this
address may be subject to interception or monitoring for operational reasons or
for lawful business purposes.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Is this unsolvable?
I even considered, since I could seem to find a div solution, a tabular solution *oh no this guy is sick in the head* but even the test cases I run on that are not favorable in IE. The idea is that the background expands and contracts bases on the nav's height. Since the float is supposed to be taken out of the flow of the page this shouldn't be a problem. And then setting the clear at the bottom for the footer. The problem is that in IE the wrappers expand to hold the float which they shouldn't. If you pull this page up in IE and FF you'll see the difference in the backgrounds. Yeah I admit I'm stumped. I tried setting the heights of the containing wrappers to 1% for IE only and setting the line height. Any other suggestions? Here is the url for the page: http://rochoet.newcitymedia.com/test.html stylesheets: http://rochoet.newcitymedia.com/css/generic.css http://rochoet.newcitymedia.com/css/layout.css http://rochoet.newcitymedia.com/css/ie.css Problem only shows up with IE. Expected effect is in Firefox. Please advise. Nick - Nick Morgan | Web Developer | New City Media P: 540.552.1320 x204 F: 540.552.5493 C: 540.921.7835 W: www.newcitymedia.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Is this unsolvable?
To: css-d@lists.css-discuss.org Subject: [css-d] Is this unsolvable? I even considered, since I could seem to find a div solution, a tabular solution *oh no this guy is sick in the head* but even the test cases I run on that are not favorable in IE. The idea is that the background expands and contracts bases on the nav's height. Since the float is supposed to be taken out of the flow of the page this shouldn't be a problem. And then setting the clear at the bottom for the footer. The problem is that in IE the wrappers expand to hold the float which they shouldn't. If you pull this page up in IE and FF you'll see the difference in the backgrounds. Yeah I admit I'm stumped. I tried setting the heights of the containing wrappers to 1% for IE only and setting the line height. Any other suggestions? Here is the url for the page: http://rochoet.newcitymedia.com/test.html stylesheets: http://rochoet.newcitymedia.com/css/generic.css http://rochoet.newcitymedia.com/css/layout.css http://rochoet.newcitymedia.com/css/ie.css Problem only shows up with IE. Expected effect is in Firefox. Please advise. I guess I am being thick here as I am not sure what you are trying to do. But FF is not rendering properly either on my machine Background images stops about half way down the page and wrapper pops out over background. Couple of suggestions, the css is based on lots of background images so hard to see where problem is. Go back a few steps and get the overalllayout with the columns working first and then build other images in one at a time. On that basis is looks like a faux column issue but there again Ian -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.394 / Virus Database: 268.9.2/370 - Release Date: 20/06/2006 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] 3 Column Layout, 2 Right Columns with Expanding Left
At my site http://digifiend.com , I have a 3 column layout with the content on the left and two side columns. I'd like to keep the positions of all the elements I've used Zoe's simple neg margin layout for this in the past: http://www.pixelsurge.com/experiment/negative_margins_2.html Simply make the current right column slightly more than double the width of the two columns you want in there(to give %$#@ IE some wiggle room) then create two divs to sit side by side in there. I added a full header and a full footer to this outside the wrapper. It worked very well. Hope that helps! bj --- avast! Antivirus: Outbound says I'm squeaky clean. Virus Database (VPS): 0620-3, 05/19/2006 Tested on: 6/22/2006 11:29:49 AM __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Is this unsolvable?
Thanks for your reply Ian. Here is a link to what I am talking about http://rochoet.newcitymedia.com/layout_behavior.gif I drew it out. All I want is for the Navigation which is static and the content area which is floated to act independently of each other. Since the page wrapper contains the footer the clear catches the main-content block and expands page-wrapper for faux column effect. My main issue is that in IE the non-floated wrappers expand to contain the floated main-content. Nick On Jun 22, 2006, at 10:50 AM, Ian Young wrote: I guess I am being thick here as I am not sure what you are trying to do. But FF is not rendering properly either on my machine Background images stops about half way down the page and wrapper pops out over background. Couple of suggestions, the css is based on lots of background images so hard to see where problem is. Go back a few steps and get the overalllayout with the columns working first and then build other images in one at a time. On that basis is looks like a faux column issue but there again Ian -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.394 / Virus Database: 268.9.2/370 - Release Date: 20/06/2006 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ - Nick Morgan | Web Developer | New City Media P: 540.552.1320 x204 F: 540.552.5493 C: 540.921.7835 W: www.newcitymedia.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Is this unsolvable?
Nicholas Morgan wrote: http://rochoet.newcitymedia.com/layout_behavior.gif I drew it out. All I want is for the Navigation which is static and the content area which is floated to act independently of each other. Since the page wrapper contains the footer the clear catches the main-content block and expands page-wrapper for faux column effect. My main issue is that in IE the non-floated wrappers expand to contain the floated main-content. We have discussed this IE/Win problem in http://www.satzansatz.de/cssd/acidicfloat.html As long as your float is wrapped in container that have layout, they will expand to contain the float. (If you try to counteract this by position:relative/overflow hacks for IE, then the float leaves the wrapper, but becomes invisible for subsequent clearing elements, since it would be taken completely out of the flow, similar to absolute positioning.) Ingo -- http://www.satzansatz.de/css.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Is this unsolvable?
Nicholas Morgan wrote: The idea is that the background expands and contracts bases on the nav's height. Since the float is supposed to be taken out of the flow of the page this shouldn't be a problem. And then setting the clear at the bottom for the footer. The problem is that in IE the wrappers expand to hold the float which they shouldn't. If you pull this page up in IE and FF you'll see the difference in the backgrounds. http://rochoet.newcitymedia.com/test.html I've looked at this page before, and the problem seems to be that you can't avoid triggering 'hasLayout'[1] since #page-area must have a 'width'. That'll cause the containers to expand to include all floats, and ruin the whole idea. Should be possible to work out a solution, but I'm short of ideas, and time, right now. Georg [1]http://www.satzansatz.de/cssd/onhavinglayout.html -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Images stacking vertically instead of horizontally in IE/Win
Hi all,
I've hit another IE/Win irritation. I have a line of 8 square images
that are supposed to sit in a horizontal row. This happens fine with
Safari and Firefox (Mac OS X and Windows) but in IE/Win the images
stack up vertically.
You can see the problem here:
http://www.tellura.co.uk/tsc/
My html is:
div id=tiles
img src=images/tile01.gif alt=Sample images class=tile_image /
img src=images/tile02.gif alt=Sample images class=tile_image /
img src=images/tile03.gif alt=Sample images class=tile_image /
img src=images/tile04.gif alt=Sample images class=tile_image /
img src=images/tile05.gif alt=Sample images class=tile_image /
img src=images/tile06.gif alt=Sample images class=tile_image /
img src=images/tile07.gif alt=Sample images class=tile_image /
img src=images/tile08.gif alt=Sample images
class=end_tile_image /
/div
and my CSS is:
#tiles {
clear: both;
float: left;
display: inline; /* to fix IE double-margin display problem */
margin: 10px;
padding: 6px 0;
border-top: 1px solid #66;
border-bottom: 1px solid #66;
}
.tile_image {
float: left;
display: inline; /* to fix IE double-margin display problem */
margin-right: 6px;
}
.end_tile_image {
display: inline; /* to fix IE double-margin display problem */
margin-right: 0;
}
I can't figure out what is causing this (I thought it might have been
IE's problem with doubling margins but I am using display: inline;).
Can anyone throw any light on this?
Thanks,
Ian.
--
Dr Ian M Piper
[EMAIL PROTECTED]
skype: ianmpiper
--
Where is the wisdom we have lost in knowledge?
Where is the knowledge we have lost in information?
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Previous adjacent selector
I just learned about adjacent selector. It allows me to set the style
differently for all labels following radio buttons which are checked
versus not:
input[type=radio]:checked + label { ... }
My question is:
I normally like to put the label first, and enclose the input element
within it. Is there anyway I can use CSS to select all labels that
*enclose* checked radio buttons?
(Firefox is the only target for this project.)
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Images stacking vertically instead of horizontally in IE/Win
Ian Piper wrote: http://www.tellura.co.uk/tsc/ I think IE tries to excessively shrink-to-fit #tiles to the minimum width. Applying a width of 100% and changing the margin into a padding of the container might be an option. Or remove the float in an IE Conditional and insert zoom:1 or display:inline-block instead. Ingo -- http://www.satzansatz.de/css.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Sprites and Image Replacement
Hi all, I wonder if a guru could help me out with my (attempted)
implementation of sprites and image replacement. Below is the css
and html which works fine in firefox and internet explorer (as far as
I can tell) and an example can be seen at http://www.rollandburn.com
I get the feeling I'm missing something important with the sprites
because there should be no need to keep repeating...
background: url(linkGrid_sectionTabs.gif) -240px -15px no-repeat;
...in the css for each of the tabs. I thought I could simply put
that under the #tabNav li {} and for each of the tabs all I would
have to set is the positioning but unfortunately the way I have it
below is the only way I could get it to work.
Arg!
I know my IR technique probably leaves a lot to be desired. =[
Thanks for any suggestions or advice to improve. =]
HTML_
ul id=tabNav
li id=tab_dashboarda href=/ title=DashboardDashboard/a/li
li id=tab_addMorta href=/ title=Add MortgageAdd Mortgage/
a/li
li id=tab_searcha href=/ title=SearchSearch/a/li
li id=tab_reportsa href=/ title=ReportsReports/a/li
/ul
CSS__
#tabNav {
margin: 0;
padding: 0;
position: relative;
}
#tabNav li {
margin: 0;
padding: 0;
list-style: none;
position: absolute;
top: 0;
width: 120px;
height: 15px;
text-indent: -5000px;
font-size: 1px;
}
#tabNav li, #tabNav a {
height: 15px;
display: block;
}
#tab_dashboard { background: url(linkGrid_sectionTabs.gif) -240px
-30px no-repeat; left: 0; }
#tab_dashboard a:hover { background: url(linkGrid_sectionTabs.gif)
-120px -30px no-repeat; }
#tab_addMort { background: url(linkGrid_sectionTabs.gif) -240px 0 no-
repeat; left: 120px; }
#tab_addMort a:hover { background: url(linkGrid_sectionTabs.gif)
-120px 0px no-repeat; }
#tab_search { background: url(linkGrid_sectionTabs.gif) -240px -15px
no-repeat; left: 240px; }
#tab_search a:hover { background: url(linkGrid_sectionTabs.gif)
-120px -15px no-repeat; }
#tab_reports { background: url(linkGrid_sectionTabs.gif) -240px -45px
no-repeat; left: 360px; }
#tab_reports a:hover { background: url(linkGrid_sectionTabs.gif)
-120px -45px no-repeat; }
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Previous adjacent selector
Robert James wrote: I normally like to put the label first, and enclose the input element within it. Is there anyway I can use CSS to select all labels that *enclose* checked radio buttons? I don't think there is. The design of CSS is meant to make it relatively easy to implement, and specifically to render progressively. So all selectors [1] are based upon ancestors and previous siblings, which you can track in a single pass through the document. If implementations had to worry about descendants and succeeding siblings, they couldn't render the document nearly as quickly. This is relatively easy to do in Javascript, and as it really describes the behavior of your page as much as it's design, Javascript is fairly appropriate to solving this case, as long as you don't mind some of your audience not seeing the effect. All that said, if you didn't mind using markup that puts the label after the input element, you could use CSS positioning or floating techniques to display the label first and then apply the adjacent siblings selector to style it as you would like. Good luck, -- Scott [1] There are some unfortunate exceptions: :last-child and especially :nth-last-* break this paradigm. I know of no others, though. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] h4/a right border alignment within td (E.M on CSS p.102)
I've been taking the course. I see you add right padding to a elements in the td , thus forcing the border to the right. I *don't* understand how the h4 right borders jump over too, and in general the h4 text remains so obedient. Does it have to do with the fact that h4 is margin: 0? -- --albo __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Mac site check please
Hello list, I need www.wuongean.com/beta/index.htm checked on a Mac. More specifically I would like to know if the popup that should appear when the kanji at the top right is hovered over works with Internet Explorer on a Mac. Thanks in advance for your help. Christine __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Is this unsolvable?
Thx Ingo. That was indeed the problem. I couldn't get away with parent nodes not having layout so I went for the positioning route. Works all except for shadows on the right and left of the page-area. Oh well.. can't seem to win that battle. Works in the same in every browser just missing that one part. If you want to see my solution its up there: http://rochoet.newcitymedia.com/test.html http://rochoet.newcitymedia.com/ stylesheets: http://rochoet.newcitymedia.com/css/generic.css http://rochoet.newcitymedia.com/css/layout.css http://rochoet.newcitymedia.com/css/ie.css Solution is a little too much of a kludge for me. My vote is for design tweak. Thanks again guys for all your help. Nick On Jun 22, 2006, at 12:05 PM, Ingo Chao wrote: We have discussed this IE/Win problem in http://www.satzansatz.de/cssd/acidicfloat.html As long as your float is wrapped in container that have layout, they will expand to contain the float. - Nick Morgan | Web Developer | New City Media P: 540.552.1320 x204 F: 540.552.5493 C: 540.921.7835 W: www.newcitymedia.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] CSS Validator working right?
Listers, I just got this error: No error or warning found To work as intended, your CSS style sheet needs a correct document parse tree. This means you should use valid HTML. No style sheet found on this page: http://66.155.251.18/jltservices.com/ What the heck does it mean? -- Tom Livingston | Senior Multimedia Artist | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS Validator working right?
i'm guessing here, but the only thing i see at a glance is that you have: @charset UTF-8; in your css. does taking that out make a difference? __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS Validator working right?
On 6/22/06, cj [EMAIL PROTECTED] wrote: i'm guessing here, but the only thing i see at a glance is that you have: @charset UTF-8; in your css. does taking that out make a difference? i hit send too soon, sorry for the spam here. you should also place: type=text/css in your link. for example: link type=text/css rel=stylesheet href=includes/main.css media=screen / __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS Validator working right?
* Tom Livingston wrote: No style sheet found on this page: http://66.155.251.18/jltservices.com/ That's probably because you have no type= attribute on your links. -- Björn Höhrmann · mailto:[EMAIL PROTECTED] · http://bjoern.hoehrmann.de Weinh. Str. 22 · Telefon: +49(0)621/4309674 · http://www.bjoernsworld.de 68309 Mannheim · PGP Pub. KeyID: 0xA4357E78 · http://www.websitedev.de/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS Validator working right?
On 6/22/06, Bjoern Hoehrmann [EMAIL PROTECTED] wrote: * Tom Livingston wrote: No style sheet found on this page: http://66.155.251.18/jltservices.com/ That's probably because you have no type= attribute on your links. -- Björn Höhrmann · mailto:[EMAIL PROTECTED] · http://bjoern.hoehrmann.de Weinh. Str. 22 · Telefon: +49(0)621/4309674 · http://www.bjoernsworld.de 68309 Mannheim · PGP Pub. KeyID: 0xA4357E78 · http://www.websitedev.de/ DOH! thank you -- Tom Livingston | Senior Multimedia Artist | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Images stacking vertically instead of horizontally in IE/Win
On 22 Jun 2006, at 5:54 pm, Ingo Chao wrote: Ian Piper wrote: http://www.tellura.co.uk/tsc/ I think IE tries to excessively shrink-to-fit #tiles to the minimum width. Applying a width of 100% and changing the margin into a padding of the container might be an option. Or remove the float in an IE Conditional and insert zoom:1 or display:inline-block instead. Thanks very much Ingo, it was indeed the width. I just put in width: 890px; and IE started to behave itself. Regards, Ian. -- Dr Ian M Piper [EMAIL PROTECTED] skype: ianmpiper -- Where is the wisdom we have lost in knowledge? Where is the knowledge we have lost in information? __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] dilemma
Hi again, Ian intelligently intoned... Oh, yeah, and if anyone can tell me what the deuce those creepy little As are about, it'd be very greatly appreciated! Looks as if the database has been copied at some point as the code if full of the little critters. Need to clean up the db and then the code - alt tags in particular before you even consider CSS. OK, as a total newbie, I'll do my best as far as the tags etc., but so far there have been very few that don't validate, and most of those are in the EDITTAGSRC/ stuff. Still looking to see if there's a way to accomplish this with CSS? And a hint as to where to find db info as to how to clean it up would be useful...(sorry Alex, I know that's not a CSS problem, but the main question is, and it all fits together) Dave __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Is this unsolvable?
On Jun 23, 2006, at 5:46 AM, Nicholas Morgan wrote: Thx Ingo. That was indeed the problem. I couldn't get away with parent nodes not having layout so I went for the positioning route. Works all except for shadows on the right and left of the page-area. Oh well.. can't seem to win that battle. Works in the same in every browser just missing that one part. If you want to see my solution its up there: http://rochoet.newcitymedia.com/test.html http://rochoet.newcitymedia.com/ Your design is now heavily dependent on the user having the same font- size as yours. Here is what I see in my default browser with my minimum font-size set to 14px. http://www.l-c-n.com/b/dump/rochoet.png And Safari 2.0 does something strange with your footer, which I haven't debugged yet http://www.l-c-n.com/b/dump/rochoet-safari.png Philippe --- Philippe Wittenbergh http://emps.l-c-n.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Is this unsolvable?
Thx for pointing that out. yeah probably need to set the min-height of the main-nav. But I think I am going to start from square one and refactor the code. I've being tweaking it too much getting it to work right, and its a little heavy. Anyways thanks for the help fellas. Nick On Jun 22, 2006, at 10:14 PM, Philippe Wittenbergh wrote: Your design is now heavily dependent on the user having the same font- size as yours. Here is what I see in my default browser with my minimum font-size set to 14px. http://www.l-c-n.com/b/dump/rochoet.png And Safari 2.0 does something strange with your footer, which I haven't debugged yet http://www.l-c-n.com/b/dump/rochoet-safari.png Philippe --- Philippe Wittenbergh http://emps.l-c-n.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ - Nick Morgan | Web Developer | New City Media P: 540.552.1320 x204 F: 540.552.5493 C: 540.921.7835 W: www.newcitymedia.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] dilemma
The special characters are from characters in your code that need to be converted to html entities. Like say needs to be ldquo; I get that a lot when I cut and past content from word into TextMate. If your clients are doing that then start there for the special characters. What are you trying to accomplish with these edittagsrc things? Are you defining a region for people to insert content? If you are using a form in the backend to update the data then you should just spit out the string into a div. Does your code in the site look for that special tag? If so you could change the way the script works and make it store the content in a variable and then just print that variable where you want it in the page. As for more help with CSS that's not really going to help you get your content from point A to point B. It is for making that content look awesome once it gets to point B. For CSS first start with getting ready of the font tags. And assigning a font-family and font-size to the body ( and using % or keyword like small) If you can go into a little more detail on the system you are using, I could be more specific but just email me directly to keep the non- CSS off the discussion list. Nick On Jun 22, 2006, at 7:18 PM, Dave Pierce wrote: Hi again, Ian intelligently intoned... Oh, yeah, and if anyone can tell me what the deuce those creepy little As are about, it'd be very greatly appreciated! Looks as if the database has been copied at some point as the code if full of the little critters. Need to clean up the db and then the code - alt tags in particular before you even consider CSS. OK, as a total newbie, I'll do my best as far as the tags etc., but so far there have been very few that don't validate, and most of those are in the EDITTAGSRC/ stuff. Still looking to see if there's a way to accomplish this with CSS? And a hint as to where to find db info as to how to clean it up would be useful...(sorry Alex, I know that's not a CSS problem, but the main question is, and it all fits together) Dave __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ - Nick Morgan | Web Developer | New City Media P: 540.552.1320 x204 F: 540.552.5493 C: 540.921.7835 W: www.newcitymedia.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Mac site check please
Christine, On my Mac in IE, the popup appears, but the font is large and the text covers the kanji, as well as the an of gean and ker of printmaker. In Safari, the popup neatly occupies just the area to the right of the kanji. regards, Margaret On Jun 22, 2006, at 9:29 PM, [EMAIL PROTECTED] wrote: Message: 14 Date: Thu, 22 Jun 2006 21:18:08 +0100 From: Christine Ce [EMAIL PROTECTED] Subject: [css-d] Mac site check please To: CSS-D css-d@lists.css-discuss.org Message-ID: [EMAIL PROTECTED] Content-Type: text/plain; charset=ISO-8859-1; format=flowed Hello list, I need www.wuongean.com/beta/index.htm checked on a Mac. More specifically I would like to know if the popup that should appear when the kanji at the top right is hovered over works with Internet Explorer on a Mac. Thanks in advance for your help. Christine __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
