Re: [css-d] css list
At 10/22/2006 09:20 PM, Brian Jones wrote:
I have a 16px x 16px image that I want to set as the background image
of a li how would i go about setting my css to accomplish this
The simple answer is:
li#example
{
width: 16px;
height: 16px;
background: url(something.jpg) left top no-repeat;
}
If the LI also contains text (as perhaps it should, to provide
content in the absence of image support), what's the relationship of
the text to the 16x16 image? Is the text hidden? Does it lie on top
of the image? What happens to that relationship as the text
resizes? Defining the situation in more detail will lead to more
detailed solutions.
Regards,
Paul
__
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] Test_please_1
~davidLaakso wrote:
Administration wrote:
http://www.highburytearooms.com.au/
http://www.highburytearooms.com.au/highbury.css
Site page renders fine in both FF 1.5 and IE 6
Experiencing problems with Opera 9.0.1 where the page font is smaller
than in the other browsers.
Keno.
Keno,
I did not see the image border problem that you mentioned in xp :: ie7,
ff, or opera.
And I do not know what you mean about the background color for the text
you wrote about.
You do need a background-color for the page, see:
http://www.chelseacreekstudio.com/ca/cssd/images/temp.jpg.
To bump the font size for Opera only, use the appropriate selector(s)
with this filter at the very bottom of the style sheet:
@media screen and (min-width: 0px){
#foo { font-size: whatever%!important; }
} /*be even nicer to opera */
Regards,
~dL
Hi David,
Thanks for your help .
Hopefully I have the background problem sorted ...
Only in Opera 9.0.1, I am getting what looks like a 1px border
on the top and both sides of the header_all.jpg image.
I have: img { border: 0;}
I am still not sure of how to set up the filter that you sent, to overcome the
font size problem .
it's effecting all font sizes on the page (footer and the business hours text).
Thanks,
Keno
__
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] I posted yesterday but I will try again
This was yesterdays post.. The html http://www.blue-fly.co.uk/trisco/test.php the css http://www.blue-fly.co.uk/trisco/css/ The problem is suckerfish goes behind the text (performance and events). Any help would be appreciated. I have had this problem berfore due to the dropdowns being absolutely positioned. The update is I have tried to absolutely position the #left and #right divs inside the relatively positioned container and possibly give them a z-index, but they dispaear!! thanks, Ross __ 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] IE7s zoom features and suckerfish stuff
Zoom - This was a feature I noticed in OPERA ages ago and thought it was really slick. The whole page zooms for the visually impaired user. I am finding ie7 messes with my suckerfish. Does IE7 not require the javascript fix? Ross __ 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] Footer problem in IE
For some reason the footer to this web page ( www.ewp-ltd.co.uk http://www.ewp-ltd.co.uk/ ) doesn't centre correctly within Internet Explorer but works fine with Firefox. Does anyone have a solution? __ 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] Footer problem in IE
To: css-d@lists.css-discuss.org
Subject: [css-d] Footer problem in IE
For some reason the footer to this web page ( www.ewp-ltd.co.uk
http://www.ewp-ltd.co.uk/ ) doesn't centre correctly within Internet
Explorer but works fine with Firefox. Does anyone have a solution?
IE doesn't recognise margin-left:auto;margin:right:auto.
to centre a div, try using percentages:
eg footer {width:90%;margin:0 5% 0%}
Ian
--
No virus found in this outgoing message.
Checked by AVG Free Edition.
Version: 7.1.408 / Virus Database: 268.13.10/491 - Release Date: 23/10/2006
__
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] css-d Navigation menu inconsistencies between IE everything else
Hi list, I'm having a problem with the bottom nav bar on some of my pages - the correct version is here: http://www.hillerypriest.co.nz/test/pr01.html and the incorrect version is here: http://www.hillerypriest.co.nz/test/commercial.html The css is http://www.hillerypriest.co.nz/test/css/all.css For some reason, it's working fine in FF, Safari, Camino etc, but in IE 6 IE 7 the nav bar appears to be out by 20px or so on some of the pages. Any suggestions would be much appreciated, Thanks, Jan (first time poster) - Find the home of your dreams with eircom net property Sign up for email alerts now http://www.eircom.net/propertyalerts __ 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] Div positioning
OK, I've done a lot more work on this and have get the basis of the tabular layout, but I do not know why the pictures will not float right or left. As this page is dynamic, and uses AJAX, I have reproduced the page statically at www.themarjlebonejournal.com/newsite/o-gazetteer.asp Regards Pete -Original Message- From: Pete Home [mailto:[EMAIL PROTECTED] Sent: 22 October 2006 17:00 To: 'css-d@lists.css-discuss.org' Subject: Div positioning I'm trying to produce tabular type layout for venues and gigs using divs where I end up with something like this; VENU 1 VENU 1 DETAILS | V1g1 DETAILS|v1g1 PICTURE v1g2 PICTURE|v1g2 DETAILS V1g3 DETAILS| VENU 2 VENUE 2 DETAILS | v2g1 DETAILS| v2g2 DETAILS|v2g2 PICTURE Etc You'll notice that some gigs have pictures and some don't, and the pictures are staggered left and right. A gig with a picture always starts a new 'row'. I thought I'd end up with something like; DIV ID=venu1 class=venueVenu1 name div ID=venu1det class=venudetailsvenue 1 details/div div id=v1g1 class=giggig 1 details/div div id=v1g1pic class=gigpicimg src=v1g1.jpg/div div id=v1g2pic class=gigpicimg src=v1g2.jpg/div div id=v1g2 class=giggig 2 details/div div id=v1g3 class=giggig 3 details/div /div div id=venu2 class=venueVenu2 name div ID=venu2det class=venudetailsvenue 2 details/div div id=v2g1 class=giggig 1 details/div div id=v2g2 class=giggig 2 details/div div id=v2g2pic class=gigpicimg src=v2g2.jpg/div /div All gigs and pictures will be 50% of the width What I wondered if there is some way of forcing this pattern of divs and ensuring they start a new 'row' when there is a pictures associated with the gig details. Regards Pete __ 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] more than css Zen Garden ?
hi all, css Zen Garden is full of beautifull variations done via css on the same html page. do you know other place like this one ? TIA, Pierre. __ 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] more than css Zen Garden ?
css Zen Garden is full of beautifull variations done via css on the same html page. do you know other place like this one ? http://icant.co.uk/csstablegallery/ I tried taking the idea of Zen Garden further, but it was a stillborn: http://csstoolshed.com/ -- Chris Heilmann Book: http://www.beginningjavascript.com Blog: http://www.wait-till-i.com Writing: http://icant.co.uk/ __ 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] CSS Tile Trick
Hi; I have a graphic I want to use for the top of the pages in a Web site. It's 788 px wide. I have little tile graphics (as high as the main graphic) I want to tile on either side of the main graphic for browsers whose resolution is greater (to fill up the space). I imagine I need to create a table with one row, a column of repeated tiles, the main graphic in a second column and finally a third column of repeated tiles. How do I repeat these tile graphics? (If my description wasn't adequate, please visit: http://test.2012.vi where you can see the main graphic with space that needs to be filled up on either side.) TIA, Ted __ 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] Div positioning
Got even further now, and the problems with the pictures is resolved. I forgot that I needed to float the picture before writing the text so the text now flows around the picture. I still have a couple of problems. Firstly, I cannot see why the section_contents div has a horizontal scroll bar. I'm assuming it's something to do you margins/padding. Also I have alternated the venues inside a div with a class of bg0 or bg1 to alternate the background colours however this seems to have no effect. Any ideas? Regards Pete -Original Message- From: Pete Home [mailto:[EMAIL PROTECTED] Sent: 23 October 2006 13:13 To: 'css-d@lists.css-discuss.org' Subject: RE: Div positioning OK, I've done a lot more work on this and have get the basis of the tabular layout, but I do not know why the pictures will not float right or left. As this page is dynamic, and uses AJAX, I have reproduced the page statically at www.themarjlebonejournal.com/newsite/o-gazetteer.asp Regards Pete -Original Message- From: Pete Home [mailto:[EMAIL PROTECTED] Sent: 22 October 2006 17:00 To: 'css-d@lists.css-discuss.org' Subject: Div positioning I'm trying to produce tabular type layout for venues and gigs using divs where I end up with something like this; VENU 1 VENU 1 DETAILS | V1g1 DETAILS|v1g1 PICTURE v1g2 PICTURE|v1g2 DETAILS V1g3 DETAILS| VENU 2 VENUE 2 DETAILS | v2g1 DETAILS| v2g2 DETAILS|v2g2 PICTURE Etc You'll notice that some gigs have pictures and some don't, and the pictures are staggered left and right. A gig with a picture always starts a new 'row'. I thought I'd end up with something like; DIV ID=venu1 class=venueVenu1 name div ID=venu1det class=venudetailsvenue 1 details/div div id=v1g1 class=giggig 1 details/div div id=v1g1pic class=gigpicimg src=v1g1.jpg/div div id=v1g2pic class=gigpicimg src=v1g2.jpg/div div id=v1g2 class=giggig 2 details/div div id=v1g3 class=giggig 3 details/div /div div id=venu2 class=venueVenu2 name div ID=venu2det class=venudetailsvenue 2 details/div div id=v2g1 class=giggig 1 details/div div id=v2g2 class=giggig 2 details/div div id=v2g2pic class=gigpicimg src=v2g2.jpg/div /div All gigs and pictures will be 50% of the width What I wondered if there is some way of forcing this pattern of divs and ensuring they start a new 'row' when there is a pictures associated with the gig details. Regards Pete __ 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] How to move image div to front or back
The page is now tentatively valid HTML 4.01 Transitional:
http://validator.w3.org/check?uri=http://www.villa-corti.com/menus.htm
I have been googling with any luck on how to send a layer to the back of a
page. How would I send the navimager layer to the back of the page?
#navimager {
Z-INDEX: 2; LEFT: 250px; FLOAT: left; WIDTH: 186px; POSITION: relative; TOP:
0px; HEIGHT: 90px
}
Thanks for any pointers!
-
Inbox full of spam? Get leading spam protection and 1GB storage with All New
Yahoo! Mail.
__
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] How to move image div to front or back
On 10/23/06, ed gooddy [EMAIL PROTECTED] wrote:
The page is now tentatively valid HTML 4.01 Transitional:
http://validator.w3.org/check?uri=http://www.villa-corti.com/menus.htm
I have been googling with any luck on how to send a layer to the back of a
page. How would I send the navimager layer to the back of the page?
#navimager {
Z-INDEX: 2; LEFT: 250px; FLOAT: left; WIDTH: 186px; POSITION: relative; TOP:
0px; HEIGHT: 90px
}
Why the all-uppercase style data? It doesn't hurt anything (except
maybe my eyes :) ), but it's somewhat atypical.
I'm not sure what you mean by send to the back of hte page.
Whatever has the lowest z-index will be at the back. If you're using
'send' to mean you're trying to do it dynamically, then you can use
CSS to change the z-index via e.g. :hover, or you can use JavaScript
with something like document.getElementById('navimager').style.zIndex
= 0;
--
Mark J. Reed [EMAIL PROTECTED]
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] absolute positioning not working either in IE6
I have created a situation where the internal bits #header #left and #right are all absoultely positioned but I still cannot seam to get the dropdown to go over the text. http://www.blue-fly.co.uk/trisco/abs.php The css http://www.blue-fly.co.uk/trisco/css/abs.css I am not too clear on how to use z-index. The bigger the number should be on top of the stack? doesIE not recognise this?? Thanks, R. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS Tile Trick
Ted Johnson wrote:
Hi; I have a graphic I want to use for the top of the pages in a Web
site. It's 788 px wide. I have little tile graphics (as high as the
main graphic) I want to tile on either side of the main graphic for
browsers whose resolution is greater (to fill up the space). I
imagine I need to create a table with one row, a column of repeated
tiles, the main graphic in a second column and finally a third column
of repeated tiles. How do I repeat these tile graphics?
http://test.2012.vi
Your imagination is playing tricks on you... :-) ...you're
overcomplicating things. The div is already covering the full width, so
all you need is a background on it.
Based on the source-code you have now, the following will work...
div align=center style=background: #cde url(images/toptile.jpg)
repeat-x 50% 0;
img src=images/template.jpg width=788 height=89 alt=The
2012.vi Community headmast /
/div
...with an image called 'toptile.jpg' fanning out from the center -
filling the entire width regardless of window-width.
That div should of course be given an ID and all styles be moved to a
stylesheet. Then it would look more like this...
HTML:
div ID=header
img src=images/template.jpg width=788 height=89 alt=The
2012.vi Community headmast /
/div
CSS:
#header {text-align: center; background: #cde url(images/toptile.jpg)
repeat-x 50% 0;}
regards
Georg
--
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Need help w/ css for IE6
My first css/xhtml site is nearing completion and it has issues in IE6. It validates as strict and looks good in Firefox, Safari and Opera. I have only occasional access to a windows machine, so it's difficult to trouble shoot via trial and error. I would surely appreciate some insight into how to fix the problems in IE without messing it up in the compliant browsers. The primary glitches are... - horizontal menu at top doesn't float, so it's not horizontal in IE (search #topmenu in css) - the header div appears to be a few pixels wider than the background image - the right column (floated right) seems to not have enough space and bumps down below the center column - horizontal rules are goofy and don't align properly - footer has vertical spacing issue (and there are probably more) Here are links to a page and the css: http://pixelpasta.com/whoweare.shtml http://pixelpasta.com/css/bpc3cola.css Thanks, John __ 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] Shrinkwrap Float problem in IE6
Hi, I am having several problems with creating a float based layout. I think I am pretty close to getting the desired effect in Firefox and Opera. Most of my problems seem to be with IE. Here is a sample page: http://shrinkwrap.precisionantibody.faustgertz.com/faq/ In Firefox and Opera, the width of the #body DIV which wraps everything is the minimum width required for everything to fit and constrains the widths of DIV#head and DIV#foot. In IE6, DIV#body as well as the DIV#head and DIV#foot are as wide as the browser window. I would like it to work like it does in Firefox and Opera. Any suggestions? The reason I am trying to use floats for the layout is the navigation bar. I want the width of the #body DIV to be as wide as needed for accommodate the width of the navigation bar. I tried setting the navigation bar based on ems, but I couldn't get it to work consistently in IE, Firefox, and Opera with various font size settings. I also attempted to use javascript to measure the width needed for the navigation bar and modify the widths of the other elements accordingly, but that would mean relying on javascript for more than I wanted for the layout. I hoped using the shrink wrap features of floats would allow for a CSS solution to the problem. I am also having problems with the DIV#foot in IE6. In the other browsers, it appears fine. In IE6, the gray area for the text is much taller than desired. It seems to work in IE6 if I use a BR or HR to clear the floats of it's pervious siblings, but I would rather not add extra elements simply to clear the floats. Any suggestions? Finally, on the home page: http://shrinkwrap.precisionantibody.faustgertz.com/ I seem to be having a problem in IE6 with an element that is both floated left and clearing the floats of it's previous siblings. I saw something about that problem in the wiki and will try to figure it out. I mention it here in case someone wants to save me some time suggest a solution. Thanks in advance, Faust Gertz __ 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] Div positioning
Sorry Guy's, the link should be www.marylebonejournal.com/newsite/o-gazetteer.asp Regards Pete -Original Message- From: Pete Home [mailto:[EMAIL PROTECTED] Sent: 23 October 2006 15:09 To: 'css-d@lists.css-discuss.org' Subject: RE: Div positioning Got even further now, and the problems with the pictures is resolved. I forgot that I needed to float the picture before writing the text so the text now flows around the picture. I still have a couple of problems. Firstly, I cannot see why the section_contents div has a horizontal scroll bar. I'm assuming it's something to do you margins/padding. Also I have alternated the venues inside a div with a class of bg0 or bg1 to alternate the background colours however this seems to have no effect. Any ideas? Regards Pete -Original Message- From: Pete Home [mailto:[EMAIL PROTECTED] Sent: 23 October 2006 13:13 To: 'css-d@lists.css-discuss.org' Subject: RE: Div positioning OK, I've done a lot more work on this and have get the basis of the tabular layout, but I do not know why the pictures will not float right or left. As this page is dynamic, and uses AJAX, I have reproduced the page statically at www.themarjlebonejournal.com/newsite/o-gazetteer.asp Regards Pete -Original Message- From: Pete Home [mailto:[EMAIL PROTECTED] Sent: 22 October 2006 17:00 To: 'css-d@lists.css-discuss.org' Subject: Div positioning I'm trying to produce tabular type layout for venues and gigs using divs where I end up with something like this; VENU 1 VENU 1 DETAILS | V1g1 DETAILS|v1g1 PICTURE v1g2 PICTURE|v1g2 DETAILS V1g3 DETAILS| VENU 2 VENUE 2 DETAILS | v2g1 DETAILS| v2g2 DETAILS|v2g2 PICTURE Etc You'll notice that some gigs have pictures and some don't, and the pictures are staggered left and right. A gig with a picture always starts a new 'row'. I thought I'd end up with something like; DIV ID=venu1 class=venueVenu1 name div ID=venu1det class=venudetailsvenue 1 details/div div id=v1g1 class=giggig 1 details/div div id=v1g1pic class=gigpicimg src=v1g1.jpg/div div id=v1g2pic class=gigpicimg src=v1g2.jpg/div div id=v1g2 class=giggig 2 details/div div id=v1g3 class=giggig 3 details/div /div div id=venu2 class=venueVenu2 name div ID=venu2det class=venudetailsvenue 2 details/div div id=v2g1 class=giggig 1 details/div div id=v2g2 class=giggig 2 details/div div id=v2g2pic class=gigpicimg src=v2g2.jpg/div /div All gigs and pictures will be 50% of the width What I wondered if there is some way of forcing this pattern of divs and ensuring they start a new 'row' when there is a pictures associated with the gig details. Regards Pete __ 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] 100% height div css problem
Hi, http://develop.oidadev.co.uk/arrogant_cat/frontend/basket_address.html I am having problems on this example of a page created with 100% height and 4 absolutely positioned divs with 100% height and background colours. The divs only take 100% height of the viewable area so when I scroll they do not extend. I reduce the height of the browser window they I lose the background of any div that does not have extra content. It seems to behave the same on all browsers It's very annoying and I would really rather use this than creating background images for the entire html area as my columns change per page. Does anyone have any ideas? Thanks Cameron Cameron Rimington Project Manager Oida Media Ltd 8a West Smithfield London EC1A 9JR Tel: +44 (0)20 7778 0200 Fax: +44 (0)20 7778 0201 Email: [EMAIL PROTECTED] mailto:[EMAIL PROTECTED] Web: www.oida.co.uk http://www.oida.co.uk/ *** This e-mail and any attached electronic files are intended for the named recipient(s) only and are confidential. They may also be legally privileged. If this message has come to you in error, please contact the sender by reply and then delete it from your system immediately. Any disclosure, copying, distribution or any action taken or omitted to be taken in reliance on it is prohibited and may be unlawful. Any statements or opinions contained herein are those of the individual and not necessarily those of Oida Media and may be subject to change without notice. Oida Media does not accept responsibility for any change made to this message after it was sent. *** __ 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] blog layout: example of compatibility with IE5 Win
Hi all!
http://ceterumcenseo.altervista.org/
this is the CSS:
html {
margin: 0;
padding: 0;
}
body {
margin: 0;
padding: 0;
background: #fff;
color: #000;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 76%;
}
a:link, a:visited {
color: #00f;
text-decoration: none;
border-bottom: 1px solid;
}
a:hover {
color: #329;
background: #ffc;
border-bottom: 1px dashed;
}
#header {
background: #fc3 url(cetero.gif) 0 50% no-repeat;
width: 100%;
height: 150px;
margin: 0;
padding: 0;
border-bottom: 1px solid #000;
}
#header h1 {
position: absolute;
top: -1000em; /* useful instead of Google's deprecated 'display: none'
}
.title {
margin: 0;
padding: 1.4em 0;
text-align: center;
font: italic 2em Trebuchet MS, Arial, Helvetica, sans-serif;
text-transform: uppercase;
}
#page {
margin: 0 250px 2em 3em;
padding: 0;
border-right: 1px solid #000;
font-size: 1em;
}
h2, h3 {
font-family: Garamond, Georgia, Times, serif;
padding: 0;
color: #666;
background: transparent;
letter-spacing: .2em;
}
h2 {
font-size: 1.6em;
margin: 0.8em 0 0 0;
}
h3 {
font-size: 1.4em;
margin: 0.75em 0 0 0;
font-style: italic;
}
* html p {margin: 0; padding: 0 1em 0.75em 1em;}
/*\*/ * html p {padding-top /*\*/: .75em;} /**/
/* padding for wrong margins calculations */
p {
text-align: justify;
margin: 0 1em 0.75em 1em;
padding: 0;
letter-spacing: .1em;
line-height: 1.5;
}
* html p.post {margin-right: 1em; margin-left: 1em;}
/* both explorers have weak inheritance here */
p.post {
padding-bottom: 3px;
border-bottom: 1px dashed #999;
text-align: right;
}
p.post a:link, p.post a:visited, p.post a:hover {border-bottom: none;
font-style: italic;}
p.ind {text-indent: 2em;}
p.center {text-align: center;}
p.center2 {text-align: right;}
span.prime{
font-size: 3em;
font-family: Times New Roman, Times, serif;
float: left;
margin: 0;
padding-right: 4px;
padding-bottom: 4px;
}
/*\*/ * html #nav { float /*\*/: right; position /*\*/: relative; top /*\*/:
40px; }/**/
/* the main problem. IE 5 win puts the absolutely positioned box at the
bottom of the page. this is a temporary solution. suggestions are really
appreciated */
#nav {
position: absolute;
top: 190px;
right: 5px;
width: 200px;
margin: 0;
padding: 0;
border-top: 3px solid #ccc;
border-left: 1px solid #ccc;
background: #fff;
color: #000;
}
#nav h4 {
margin: 0.8em 0.5em;
padding: 0;
text-transform: uppercase;
font: bold italic 1em Trebuchet MS, Trebuchet, Arial, Helvetica,
sans-serif;
color: #008;
background: transparent;
text-align: center;
}
#nav ul {
margin-left: 1em;
padding-left: 0;
list-style: none;
}
#nav li {
margin: 1em 0.3em;
padding-bottom: 3px;
border-bottom: 1px dashed #8fac98;
}
#nav a:link, #nav a:visited, #nav a:hover, #nav a:focus {
border-bottom: none;
outline-style: none;
}
#nav a:link, #nav a:visited {
display: block;
margin: 0;
padding: 4px;
background: transparent;
}
#nav a:hover {
background: #000;
color: #fff;
}
/*\*/ * html #nav li {padding-bottom /*\*/: 0px;}/**/
/*\*/ * html #nav a:link, * html #nav a:visited {
margin /*\*/: 4px 0 0 0; position /*\*/: relative; height /*\*/: 1%; w\idth
/*\*/: auto;
}/**/
/* IE5 win needs this to create the correct layout for buttons */
ul, ol {
margin-left: 2em;
padding-left: 0;
line-height: 1.8;
}
ul {
list-style-type: square;
}
ol {
list-style-type: upper-roman;
}
li {
margin: 0;
padding: 0;
}
dl {
margin: 1.12em;
padding: 0;
}
dt {
margin: 1em 0;
padding: 3px 0;
border-top: 1px solid #000;
border-bottom: 1px solid #000;
}
dd {
margin: 0.75em 0 0.75em 2em;
padding: 0;
}
.hide {position: absolute; top: -1000em;}
.spacer {height: 1px; font-size: 1px;}
/*\*/ * html .qui {line-height /*\*/: 100%; vertical-align /*\*/:
middle;}/**/
.qui {border-bottom: 5px solid #000; padding-bottom: 3px; height: 1%;}
/* hack used to force IE5 win to apply border to an inline element.
'vertical-align' is used to balance 'height: 1%'
Suggestions are really appreciated. many thanks for your attention. I hope
someone find it useful. bye
Gabriele Romanato
--
http://www.css-zibaldone.com/the-css-switch-project/
__
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] Need help w/ css for IE6
John Tice wrote: I would surely appreciate some insight into how to fix the problems in IE without messing it up in the compliant browsers. The primary glitches are... How does it work if you remove ?xml version=1.0 encoding=utf-8? from the top of your XHTML code? That bit of text is throwing IE6 into quirksmode and thus causing IE6 to use the old IE box model instead of the W3C box model. See http://www.quirksmode.org/css/quirksmode.html for details. Hope this helps, Faust __ 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] box model problem?
Hi, I am having a problem getting my page to look right in internet explorer. I have tested it on firefox, safari, opera, and it looks fine but when I go to IE it breaks. Im pretty new to CSS and I recently discovered the box model problem and feell like this is the issue that Im having. here is the page: dangerousmuse.blogspot.com if anyone can offer a suggestion It would be GREATLY appreciated. I know that there are box model hacks but I don't know how to implement them. btw, this is my first post. I discovered the URL through a WROX book. =) __ 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] Need help w/ css for IE6
John Tice wrote:
My first css/xhtml site is nearing completion and it has issues in
IE6. It validates as strict and looks good in Firefox, Safari and
Opera. I have only occasional access to a windows machine, so it's
difficult to trouble shoot via trial and error. I would surely
appreciate some insight into how to fix the problems in IE without
messing it up in the compliant browsers.
Most problems will be solved by simply deleting the 'xml-declaration'
above the 'doctype-declaration' - allowing IE6 to render in a more
standard compliant mode. Won't cause any problems for real 'standard
compliant' browsers, as they are there already.
That'll leave IE6 with only one very weak spot left - the auto-expansion
bug. Nothing noticeable on normal font-size, but one step up in IE6 and
the right column will be dropped...
- the right column (floated right) seems to not have enough space and
bumps down below the center column
Add...
* html #rightcontent {overflow-x: hidden; margin-left: -10px;}
* html #rightcontent * {position: relative;}
...if you like that column to stay up there in IE-win too.
http://pixelpasta.com/whoweare.shtml
regards
Georg
--
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Dynamic Content Falling Behind Absolute Footer in IE (standards mode, but not quirks)
In IE in Standards Mode, my Ajax-updated content is being pushed behind the footer. As far as I can tell, this isn't a hasLayout issue. Please Correct me if I'm wrong here, but as I understand it, all the important elements here have layout, and should be behaving properly. To see the expected behavior visit http://yammr.com/quirks.html To see the page misbehaving in Standards Mode see http://yammr.com/ strict.html The only real differences between the two pages is the doctype at the top of strict.html. The end goal here is to have a center aligned header/body/absolute footer layout that works properly in major browsers and allow for dynamic resizing of inner elements. I hope this goal isn't too lofty. __ 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] shopping carts
I need to find a shopping cart that can work out postage/shipping costs, paypal only allows one currency does anyone know a good one we only have one product to sell but need to include all the various postage costs. Using a mac and dreamweaver Also the middle section is pushing the right hand div to the bottom in I E - help anyone please http://www.philturner-uk.com/ypny/ Kind Regards Phil Turner FREELANCE CREATIVE TEL: 0161 439 1669 Chartered Graphic Designer MCSD BA Hons [EMAIL PROTECTED] http://www.philturner-uk.com V I S I T M Y D E S I G N B L O G http://www.philturnerdesigner.blogspot.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] shopping carts
Did you try Mals? http://www.mals-e.com. There are many different currency and postage settings. Contact me offlist if you want more help. HTH, Riva Phil Turner wrote: I need to find a shopping cart that can work out postage/shipping costs, paypal only allows one currency does anyone know a good one we only have one product to sell but need to include all the various postage costs. Using a mac and dreamweaver Also the middle section is pushing the right hand div to the bottom in I E - help anyone please http://www.philturner-uk.com/ypny/ Kind Regards Phil Turner FREELANCE CREATIVE TEL: 0161 439 1669 Chartered Graphic Designer MCSD BA Hons [EMAIL PROTECTED] http://www.philturner-uk.com V I S I T M Y D E S I G N B L O G http://www.philturnerdesigner.blogspot.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] shopping carts
Phil Turner wrote: I need to find a shopping cart that can work out postage/shipping costs, paypal only allows one currency does anyone know a good one we only have one product to sell but need to include all the various postage costs. Take a look here: http://www.zencart.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] CSS Tile Trick
That worked! Thanks!
Ted
- Original Message
From: Gunlaug Sørtun [EMAIL PROTECTED]
To: Ted Johnson [EMAIL PROTECTED]
Cc: css-d@lists.css-discuss.org
Sent: Monday, October 23, 2006 10:40:13 AM
Subject: Re: [css-d] CSS Tile Trick
Ted Johnson wrote:
Hi; I have a graphic I want to use for the top of the pages in a Web
site. It's 788 px wide. I have little tile graphics (as high as the
main graphic) I want to tile on either side of the main graphic for
browsers whose resolution is greater (to fill up the space). I
imagine I need to create a table with one row, a column of repeated
tiles, the main graphic in a second column and finally a third column
of repeated tiles. How do I repeat these tile graphics?
http://test.2012.vi
Your imagination is playing tricks on you... :-) ...you're
overcomplicating things. The div is already covering the full width, so
all you need is a background on it.
Based on the source-code you have now, the following will work...
div align=center style=background: #cde url(images/toptile.jpg)
repeat-x 50% 0;
img src=images/template.jpg width=788 height=89 alt=The
2012.vi Community headmast /
/div
...with an image called 'toptile.jpg' fanning out from the center -
filling the entire width regardless of window-width.
That div should of course be given an ID and all styles be moved to a
stylesheet. Then it would look more like this...
HTML:
div ID=header
img src=images/template.jpg width=788 height=89 alt=The
2012.vi Community headmast /
/div
CSS:
#header {text-align: center; background: #cde url(images/toptile.jpg)
repeat-x 50% 0;}
regards
Georg
--
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Lowest Z index not at back
Hi all,
The navimager div
#navimager {
z-index: 9; left: 250px; float: left; width: 186px; position: relative; top:
0px; height: 90px
}
in this page http://www.villa-corti.com/menus.htm has the highest z index but
it overlaps the other divs. Why? How can I make it go to background(not as a
background iamge) Thanks
-
Try the all-new Yahoo! Mail . The New Version is radically easier to use
The Wall Street Journal
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE 7 - Extra padding-top
David, I don't believe tight coding had anything to do with it. You simply moved the background style to the containing div. This is a fix but not always possible or desirable. See this second test case which uses your code with the background style applied to the containing div (#pagehead): http://www.stammbt.com/testing/testie7_2.html Thanks, Nate Kresse On 10/22/06 4:24 AM, ~davidLaakso [EMAIL PROTECTED] wrote: Nate Kresse wrote: Hello All, I came across a situation where IE7 (fresh copy downloaded today) inserts extra padding-top when applied to an element inside a cleared div that comes after a floated div. It also seems like it is related to using the shortcut to apply a background color. Check out my test case here: http://www.stammbt.com/testing/testie7.html It can be fixed a number of ways. 1. If you add a border to the div with the property: clear:both 2. Removing the background property 3. Completing the background property shortcut - adding url(image) no-repeat 0 0; 4. removing the float on the first div You get the point... This page displays correct in every browser that I've loaded it into except IE7. I have no idea what is going on. Or why it is going on. Or what causes something to correct it.. Tight coding seemed to yield a consistent result? http://www.chelseacreekstudio.com/ca/cssd/bug.html http://www.browsercam.com/public.aspx?proj_id=293476 Best, ~dL __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE 7 - Extra padding-top
Correction: You moved the background style to the paragraph inside the containing div. Thanks, Nate On 10/23/06 12:22 PM, Nate Kresse [EMAIL PROTECTED] wrote: David, I don't believe tight coding had anything to do with it. You simply moved the background style to the containing div. This is a fix but not always possible or desirable. See this second test case which uses your code with the background style applied to the containing div (#pagehead): http://www.stammbt.com/testing/testie7_2.html Thanks, Nate Kresse On 10/22/06 4:24 AM, ~davidLaakso [EMAIL PROTECTED] wrote: Nate Kresse wrote: Hello All, I came across a situation where IE7 (fresh copy downloaded today) inserts extra padding-top when applied to an element inside a cleared div that comes after a floated div. It also seems like it is related to using the shortcut to apply a background color. Check out my test case here: http://www.stammbt.com/testing/testie7.html It can be fixed a number of ways. 1. If you add a border to the div with the property: clear:both 2. Removing the background property 3. Completing the background property shortcut - adding url(image) no-repeat 0 0; 4. removing the float on the first div You get the point... This page displays correct in every browser that I've loaded it into except IE7. I have no idea what is going on. Or why it is going on. Or what causes something to correct it.. Tight coding seemed to yield a consistent result? http://www.chelseacreekstudio.com/ca/cssd/bug.html http://www.browsercam.com/public.aspx?proj_id=293476 Best, ~dL __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Lowest Z index not at back
ed gooddy wrote:
Hi all,
The navimager div
#navimager {
z-index: 9; left: 250px; float: left; width: 186px; position: relative; top:
0px; height: 90px
}
in this page http://www.villa-corti.com/menus.htm has the highest z index
but it overlaps the other divs. Why? How can I make it go to background(not
as a background iamge) Thanks
Alright Ed,
I added position:relative to #navbar and that did the trick, z-index
only works on elements that are positioned relatively, absolutely and
fixed. I've not tested z-indexing fixed boxes so I don't know much about
how it's handled cross-browser except that IE6 doesn't natively support
position fixed.
Hope that helps,
Rob
__
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] centering elements in IE
Hi all,
In most browsers, I can do things like
img.logo { margin: 0 auto; }
which results in the element centred within its parent container.
Of course, this does not work with IE. Short of adding
a text-align:center to the parent (which is *not* what I want), how
can one get the same effect with IE?
Cheers,
--
martin; (greetings from the heart of the sun.)
\ echo mailto: !#^.*|tr * mailto:; [EMAIL PROTECTED]
spamtraps: [EMAIL PROTECTED]
administration for windows networks is similar to maintaining a 12
year old gm truck. brand new, w2k+3 already has 190k miles of wear.
-- jeremiah cornelius
signature.asc
Description: Digital signature (GPG/PGP)
__
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] centering elements in IE
Op 23-okt-2006, om 20:07 heeft martin f krafft het volgende geschreven:
Hi all,
In most browsers, I can do things like
img.logo { margin: 0 auto; }
which results in the element centred within its parent container.
Of course, this does not work with IE. Short of adding
a text-align:center to the parent (which is *not* what I want), how
can one get the same effect with IE?
Cheers,
--
martin; (greetings from the heart of the sun.)
\ echo mailto: !#^.*|tr * mailto:; [EMAIL PROTECTED]
Use text-align: center; on the parent element.
Stefan
__
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] Need some help with MIR image replacement. Also, Missing list-style-type:disc.
I am trying to use MIR image replacement. Works great in Fireworks, but in IE (PC) and Safari it shows the first letters of the text that is being replaced. Making me crazy, can't figure out what is going on. ALso, I am missing the discs in my ul. I can not figure out why they are not showing up. Any help would be great. MIR technique here: http://www.stuffandnonsense.co.uk/archives/ mir_image_replacement.html Page in Question Here: http://orcas.purebluedesign.com/Step2/ disk_list.php CSS All Here: http://orcas.purebluedesign.com/Step2/css/sp_default.css - defauly css set http://orcas.purebluedesign.com/Step2/css/colors.css http://orcas.purebluedesign.com/Step2/css/print.css Thanks. David Merwin [EMAIL PROTECTED] 541-335-1832 http://www.davemerwin.com http://www.purebluedesign.com http://www.betachurch.org http://www.agiprofessional.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] centering elements in IE
Hi all,
In most browsers, I can do things like
img.logo { margin: 0 auto; }
which results in the element centred within its parent container.
Of course, this does not work with IE. Short of adding
a text-align:center to the parent (which is *not* what I want), how
can one get the same effect with IE?
Of course part is wrong here. This does work in IE6+, just make sure
that IE is in standards-compliant mode.
http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnie60/html/cssenhancements.asp
Regards,
Rimantas
--
http://rimantas.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] Test_please_1
Administration wrote:
~davidLaakso wrote:
Administration wrote:
http://www.highburytearooms.com.au/
http://www.highburytearooms.com.au/highbury.css
Site page renders fine in both FF 1.5 and IE 6
Experiencing problems with Opera 9.0.1 where the page font is smaller
than in the other browsers.
Keno.
Keno,
I did not see the image border problem that you mentioned in xp :: ie7,
ff, or opera.
And I do not know what you mean about the background color for the text
you wrote about.
You do need a background-color for the page, see:
http://www.chelseacreekstudio.com/ca/cssd/images/temp.jpg.
To bump the font size for Opera only, use the appropriate selector(s)
with this filter at the very bottom of the style sheet:
@media screen and (min-width: 0px){
#foo { font-size: whatever%!important; }
} /*be even nicer to opera */
Regards,
~dL
Hi David,
Thanks for your help .
Hopefully I have the background problem sorted ...
Only in Opera 9.0.1, I am getting what looks like a 1px border
on the top and both sides of the header_all.jpg image.
I have: img { border: 0;}
I am still not sure of how to set up the filter that you sent, to overcome
the font size problem .
it's effecting all font sizes on the page (footer and the business hours
text).
Thanks,
Keno
You have resolved the background-color problem in Opera.
I still do not see the border issue in xp opera/9.01 (that does not mean
that it does not exist on your end).
Try this in your css file: img {border: none;}
(and re-inforce it in the opera hack as below)
Re-set the opera filter for the font-problem (and border issue) to:
@media screen and (min-width: 0px){
img { border: none!important; }
h4 { font-size: 90%!important; }
} /*be even nicer to opera */
If this does not resolve the opera problem(s), start a new thread with
the subject line: opera/9.01 issues.
State the specific issue(s) and the operating system that you are
running when you experience them in opera 9.01.
HTH
~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] centering elements in IE
Rimantas Liubertas wrote:
Hi all,
In most browsers, I can do things like
img.logo { margin: 0 auto; }
which results in the element centred within its parent container.
Of course, this does not work with IE. Short of adding
a text-align:center to the parent (which is *not* what I want), how
can one get the same effect with IE?
Of course part is wrong here. This does work in IE6+, just make sure
that IE is in standards-compliant mode.
http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnie60/html/cssenhancements.asp
Regards,
Rimantas
If it still doesn't work make sure the image in question is set to
display: block;
__
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] Lowest Z index not at back
D´oh!! Right let me change the z-index order around and see what happens..
David Merwin [EMAIL PROTECTED] wrote: You have the z-index numbers
backwards?
The higher the number, the higher it is stacked. The lower the number, the
lower it is stacked. If you want the div in the back, set it's z-index to 0 or
lower.
Here's an example:
http://www.w3schools.com/dhtml/tryit.asp?filename=trydhtml_zindex2
David Merwin
541-335-1832
[EMAIL PROTECTED]
On Oct 23, 2006, at 10:10 AM, ed gooddy wrote:
Hi all,
The navimager div
#navimager {
z-index: 9; left: 250px; float: left; width: 186px; position: relative; top:
0px; height: 90px
}
in this page http://www.villa-corti.com/menus.htm has the highest z index
but it overlaps the other divs. Why? How can I make it go to background(not as
a background iamge) Thanks
-
Try the all-new Yahoo! Mail . The New Version is radically easier to use
The Wall Street Journal
__
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/
Send instant messages to your online friends http://uk.messenger.yahoo.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] Lowest Z index not at back
D´oh!! Thanks David Right let me change the z-index order around and see what
happens...
David Merwin [EMAIL PROTECTED] wrote: You have the z-index numbers
backwards?
The higher the number, the higher it is stacked. The lower the number, the
lower it is stacked. If you want the div in the back, set it's z-index to 0 or
lower.
Here's an example:
http://www.w3schools.com/dhtml/tryit.asp?filename=trydhtml_zindex2
David Merwin
541-335-1832
[EMAIL PROTECTED]
On Oct 23, 2006, at 10:10 AM, ed gooddy wrote:
Hi all,
The navimager div
#navimager {
z-index: 9; left: 250px; float: left; width: 186px; position: relative; top:
0px; height: 90px
}
in this page http://www.villa-corti.com/menus.htm has the highest z index
but it overlaps the other divs. Why? How can I make it go to background(not as
a background iamge) Thanks
-
Try the all-new Yahoo! Mail . The New Version is radically easier to use
The Wall Street Journal
__
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/
-
Try the all-new Yahoo! Mail . The New Version is radically easier to use
The Wall Street Journal
__
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] Lowest Z index not at back
Thanks Rob, didn´t realize that about the postion: relative on the navbar div.
I will try it out thanks a lot
Rob O'Rourke [EMAIL PROTECTED] wrote: ed gooddy wrote:
Hi all,
The navimager div
#navimager {
z-index: 9; left: 250px; float: left; width: 186px; position: relative; top:
0px; height: 90px
}
in this page http://www.villa-corti.com/menus.htm has the highest z index but
it overlaps the other divs. Why? How can I make it go to background(not as a
background iamge) Thanks
Alright Ed,
I added position:relative to #navbar and that did the trick, z-index
only works on elements that are positioned relatively, absolutely and
fixed. I've not tested z-indexing fixed boxes so I don't know much about
how it's handled cross-browser except that IE6 doesn't natively support
position fixed.
Hope that helps,
Rob
__
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/
-
All new Yahoo! Mail The new Interface is stunning in its simplicity and ease
of use. - PC Magazine
__
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] How to define a section on a page where CSS has ZERO effect?
I need a define an area on a page where dynamic data will be displayed where CSS defined for that page has NO EFFECT on the area at all. Basically inside a highly styled page: div id=noCSS pAnything the client want goes here, formatted however the heck the client wants formatted - total control up to the client./p /div Ideas? __ 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] Menu's Sticking in IE
Here is the page link: http://www.ecu.edu/cs-dhs/customcf/murphyp/sample3-4.html I am not finished styling this so please ignore the appearance. It works like I want it to in Firefox and Opera, but in IE, the submenus that appear on the mouseover get stuck and won't go away. I have no clue as to why. plm __ 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] How to define a section on a page where CSS has ZERO effect?
I need a define an area on a page where dynamic data will be displayed where CSS defined for that page has NO EFFECT on the area at all. Basically inside a highly styled page: div id=noCSS pAnything the client want goes here, formatted however the heck the client wants formatted - total control up to the client./p /div Ideas? -- I'm new to the list as of today so if my thoughts are retarded please be kind... :) Does your client know how to design the content? That is, can they code HTML CSS? If so I would think the easiest way would be just like above and make the client design their own style sheet that you could link secondarily. They would have to know that all their content stylization needs to be preceded by the #noCSS id. Just a thought... Mike __ 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] css rule not working
Help, my first attempt at css and I'm already stuck!
I've just created a class called homepage-box within an id called
content. However, my css rule #content.homepage-box does not show any
rules I set (top border etc.), either in Dreamweaver's design view, or on
the uploaded page at www.devonweddingcakes.co.uk Here's the code, followed
by the css sheet. Can anyone help please?
body
div id=header
a href=#img src=images/cake_logo.jpg alt=logo with close up photos
of cakes width=969 height=99 id=logo //a
div id=header-bottom
ul
lia href=#Home/a/li
lia href=#About/a/li
lia href=#Testimonials/a/li
lia href=#Contact/a/li
lia href=#Sitemap/a/li
/ul
/div
/div
div id=content
h1Cakes to celebrate any occasion/h1
div class=homepage-box
h2a href=#Wedding Cakes/a/h2
pWe can design and create your wedding cake according to your wishes.
Choose from traditional royal iced wedding cakes, sugarcraft cakes,
chocolate cakes, novelty cakes, and individual cup cake amp; mini cake
towers.img src=images/wedding_cake_chocolate.jpg alt=Wedding cake in
dark and milk chocolate width=200 height=294 //p
/div
div class=homepage-box
h2a href=#Corporate Cakes /a/h2
pMake your corporate event special with a cake from us. 25 years
experience of making these types of cake ensures that it will project
exactly the right image for your business. img
src=images/corporate_cake_first.jpg alt=Corporate cake iced with first
great western width=425 height=294 //p
/div
div class=homepage-box
h2a href=#Birthday Cakes/a/h2
pFirst birthday cakes, children's party cakes, 18th and 21st birthday
cakes, 40's 50's etc., right through to cakes for centenarians, everyone
needs a birthday cake! img src=images/birthday_cake_ship.jpg
alt=birthday cake with ship, train and dolphins width=304 height=294
//p
/div
div class=homepage-box
h2a href=#Novelty Cakes /a/h2
pLet your imagination run riot!Almost anything can be turned into a
cake. img src=images/novelty_cake_wolf.jpg alt=a cake shaped like a
wolfs head width=313 height=294 //p
/div
div class=homepage-box
h2a href=#Christening Cakes /a/h2
pChoose from contemporary or traditional cakes, tiered or non-tiered.
img src=images/christening_cake_tiered.jpg alt=Tiered christening cake
with baby on top width=297 height=294 //p
/div
div class=homepage-box
h2a href=#Anniversary Cakes /a/h2
pSilver, Ruby, Gold, Diamond anniversary - celebrate the achievement
with a fitting cake. img src=images/anniversary_cake_golden.jpg
alt=golden wedding anniversary cake width=287 height=294 //p
/div
div class=homepage-box
h2a href=#Photo Cakes /a/h2
pParticularly good for birthday and anniversary cakes, bring out those
treasured old photographs, and let us transfer them onto your cake. Also
great for any picture or image that's difficult to reproduce by traditional
icing methods.img src=images/photo_cake_corporate.jpg alt=a magazine
cover printed on a cake width=357 height=294 / /p
/div
div class=homepage-box
h2a href=#Other Cakes /a/h2
pLeaving cakes, retirement cakes, and any cake not in our other
categories.img src=images/retirement_cake_gardening.JPG alt=cake with
marzipan fruits and vegetables on top width=300 height=285 //p
/div
/div
body {
font-size: 1em;
color: #00;
background-color: #FF;
margin: 0px;
padding: 0px;
}
#header {
width: 100%;
}
#logo {
position: absolute;
left: 0px;
top: 0px;
}
#header-bottom {
background-color: #CCFFCC;
height: 10px;
margin-top: 100px;
}
#header-bottom ul {
margin: 0px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
}
#header-bottom li a:link {
color: #00;
text-decoration: none;
}
#header-bottom li a:visited {
color: #00;
text-decoration: none;
}
img {
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
}
#header-bottom li {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 90%;
font-weight: bold;
display: inline;
margin-right: 2.4em;
}
#content {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 80%;
margin-top: 50px;
margin-right: 40px;
margin-left: 150px;
}
#content.homepage-box {
float: right;
width: 49%;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #CCFFCC;
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] css rule not working
On 10/23/06, Jon Rendle [EMAIL PROTECTED] wrote: However, my css rule #content.homepage-box does not show any rules I set (top border etc.), div id=content h1Cakes to celebrate any occasion/h1 div class=homepage-box #content.homepage-box is a single specifier for the element with id content and class homepage-box. Which would be redundant at best, but you have no such element. What you have is an element with class homepage-box *inside* an element with id content. That calls for a descendant specification, which means you need a space between whatever matches the container and whatever matches the containee: #content .homepage-box -- Mark J. Reed [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] IE7 and Safari issues
Hi listers, http://66.155.251.18/mlinc.com/06/clients/ Anyone see why IE7 is adding extra space to the right, causing horizontal scroll when _above_ my min-width? Also, in Safari and latest Webkit nightly, the 3 yellow thumbs and Portfolio/White Paper links are too low on the page. They should line up with the red thumb on the far right - like every other browser. Any thoughts here? Of course, I could be going about the positioning is a less than optimal way... Thanks a bunch for looking. -- 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 IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] css rule not working
Hi Jon, I've just created a class called homepage-box within an id called content. However, my css rule #content.homepage-box does not show any rules I set [...] #content.homepage-box Your selector refers to any element which has an id attribute of value content AND a class attribute of value homepage-box. What you want is an element, which has your class attribute and is a descendand of another element with id content. Mind the gap! This selector has a space between #content and .homepage-box: #content .homepage-box When in doubt about the meaning of certain selectors you will certainly find the Selectoracle quite useful: http://gallery.theopalgroup.com/selectoracle/ Cheers, jens -- Jens Brueckmann http://www.yalf.de __ 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] How to define a section on a page where CSS has ZERO effect?
if i'm reading you right, you're asking how do i reset all styling for this p so the customer has a clean slate?. if i got that right, in your style sheet you'll have to do a reset where you set the margin, border, width, etc back to normal. this could either be 0, auto, or none, depending on the property. for example if you wanted to negate any border the p might have, do a border: none;. then make sure that whatever the client is styling has a higher specificity than your reset styles. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] IE and Safari issues (UPDATE)
Hi listers, http://66.155.251.18/mlinc.com/06/clients/ Anyone see why IE7 is adding extra space to the right, causing horizontal scroll when _above_ my min-width? Also, in Safari and latest Webkit nightly, the 3 yellow thumbs and Portfolio/White Paper links are too low on the page. They should line up with the red thumb on the far right - like every other browser. Any thoughts here? Of course, I could be going about the positioning is a less than optimal way... Thanks a bunch for looking. OK, I solved the Safari problem. Still have extra space in IE7... -- 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 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] Struggling with IE6 compatibility for Holy Grail
I have tried to use a modified version of AListApart's Holy Grail article to line up the columns on my site (URL in my signature). The modification is that a) I have put columns in the header and footer, b) Mostly I only have two columns instead of 3 - setting one of the column widths to 0. But IE doesn't display it correctly, and I can't work out what is wrong. In particular, the leftmost column in the header has id #logo, with a picture as the background image in the CSS. It seems to disappear in IE6, although as you squash to width of the page down it suddenly jumps up and appears, but shifted down the page. Can someone help me understand why, and help me fix it please. -- Alan Chandler http://www.chandlerfamily.org.uk __ 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] some sort of problem.
Jon Hughes wrote:
http://www.phazm.net/stamps/products.html
[...]
Francky wrote: [...] to be continued.
= = =
Ending with 7 Golden Rules of Webdesign and Testpage-3
http://home.tiscali.nl/developerscorner/css-discuss/test-stampdepot-3.htm,
here is a supplement.
For the left column I think a fixed width can be used. A liquid left
column (in % of the screen width) would eat too much space of the
content part, if the page is viewed in smaller resolutions. - The fixed
width must be not too small either, to enable font scaling at 800x600. I
came on about 200px, but that can be changed of course if desired. Then
some adaptations of the nav-list have to be made, to use the available
column width. Result is:
* Testpage-4
http://home.tiscali.nl/developerscorner/css-discuss/test-stampdepot-4.htm
Html-validator and css-validator still congratulate. [1] - Fine tuning
(of fonts and so) can be done later. First the wilderness of white in
the content column! ;-)
With a floating left column, a straight right column will fill the
remaining space. A left margin is prohibiting the content to stream
under the bottom line of the left column, in case the content column is
longer than the left column. Result can be:
* Testpage-5
http://home.tiscali.nl/developerscorner/css-discuss/test-stampdepot-5.htm
Html-validator and css-validator still congratulate. [1] - So far with
the testpages
Addendum to the Golden Rules:
8. Write your css not in 1 line for each element, but
ONE LINE FOR EACH PROPERTY/VALUE ITEM.
Then it is easier to read and to change: quick cut/copy/paste
of a line, moving to another element, and so on.
9. Also in html: don't be soft for your hard disk,
DON'T COMPACT CODE. Give indents for all div's, ul's, li's
and other elements. Then it is easy to see what is what, and
especially where are the ends of the elements, and where a new
element is starting.
10. The quick X-OUT METHOD can be used instead of commenting out
some line with /* ... */ (in css) or !-- ... -- (in html).
Like this:
#content {
margin: 5px;
xpadding: 10px;
}
or this:
div xid=content.../div
If you forget to remove one later on, no problem: the css-
validator or html-validator will help to remember.
11. The A-B-C METHOD can be used to find out where on screen a
floating div is ending, and where a clear has to be given.
Just type a plain letter a before the first /div, a letter
b before the second /div, and so on.
Then the position of the letters is not influenced by properties
of a p or other containg element, which can be distracting or
moving the position.
For better viewing, a
span style=background: yellow; color: red;a/span
can be used, if needed.
To be continued!
francky
[1] Only alarming about the xborders, as described in Golden Rule #10.
:-)
If css-validating with the button on the FF-DevelopersToolBar, then an
alarm about invalid use of inline-block is given. But that is valid
css2.1! Howcome? Because the default testing of the validator is in the
older (unusual) css2. - If tested in css2.1, the inline-block is
permitted (no more error). See:
http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fhome.tiscali.nl%2Fdeveloperscorner%2Fcss-discuss%2Ftest-stampdepot-4.htmamp;warning=noamp;profile=css21amp;usermedium=all
http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fhome.tiscali.nl%2Fdeveloperscorner%2Fcss-discuss%2Ftest-stampdepot-4.htmamp;warning=noamp;profile=css21amp;usermedium=all
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE and Safari issues (UPDATE)
Tom Livingston wrote: Hi listers, http://66.155.251.18/mlinc.com/06/clients/ Anyone see why IE7 is adding extra space to the right, causing horizontal scroll when _above_ my min-width? Also, in Safari and latest Webkit nightly, the 3 yellow thumbs and Portfolio/White Paper links are too low on the page. They should line up with the red thumb on the far right - like every other browser. Any thoughts here? Of course, I could be going about the positioning is a less than optimal way... Thanks a bunch for looking. OK, I solved the Safari problem. Still have extra space in IE7... If you mean with font zoom: I think your page performs as intended at text-size 'larger' and text-size 'largest' in IE7.0; and, that /IE.0 is flawed,/ not your page, at zoom using Ctrl + and zoom using percentage. Regards, ~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] ie7 Suckerfish menu problems?
Anyone else had any problems with the Suckerfish dropdowns in ie7
beta 3?
I'll roll over one link which reveals the drop down list for that
link but
when I roll off the link the list doesnt go away. So if I roll over
another
link the previous list I had rolled over is still showing. Also, if
the list
has a second level it will show the first time I roll over it but if
another
link has a second level it doesnt pop out.
Any cures for this?
If anyone's still experiencing a problem with this, I've posted a simple
fix at
http://www.builtfromsource.com/2006/10/23/a-fix-for-suckerfish-dropdowns-in-ie-7/
The gist is:
#menu li:hover, #menu li.hover {
position: static;
}
Hope that helps,
-Matt
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE and Safari issues (UPDATE) / IE7 horizontal scrollbar
Tom Livingston wrote: Hi listers, http://66.155.251.18/mlinc.com/06/clients/ Anyone see why IE7 is adding extra space to the right, causing horizontal scroll when _above_ my min-width? IE 7 seems to have problems with the right floating ul and li with negative text-indent. !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd; html xmlns=http://www.w3.org/1999/xhtml; head meta http-equiv=Content-Type content=text/html; charset=utf-8 / title/title /head body ul style=float: right li style=text-indent: -1pxright/li /ul /body /html This gives a huge scrollbar. Disappointing. Ingo -- http://www.satzansatz.de/css.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Div positioning
Pete Home wrote:
Sorry Guy's, the link should be
www.marylebonejournal.com/newsite/o-gazetteer.asp
Regards
Pete
It's a difficult link! ;-)
I got result on:
http://www.THEmarylebonejournal.com/newsite/o-gazetteer.asp
-Original Message-
From: Pete Home [mailto:[EMAIL PROTECTED]
Sent: 23 October 2006 15:09
To: 'css-d@lists.css-discuss.org'
Subject: RE: Div positioning
Got even further now, and the problems with the pictures is resolved. I
forgot that I needed to float the picture before writing the text so the
text now flows around the picture.
I still have a couple of problems. Firstly, I cannot see why the
section_contents div has a horizontal scroll bar. I'm assuming it's
something to do you margins/padding. Also I have alternated the venues
inside a div with a class of bg0 or bg1 to alternate the background colours
however this seems to have no effect. Any ideas?
Regards
Pete
I took my bug hunting glasses, and see:
Validating first. - Html-validator is friendly pointing to a missing
/div. Repaired, but no effect on the hor. scroll bar.
Css-validator is falling over the IE-hover expression for a tr; cannot
have repercussions for the scroll bar...
Then I changed the:
#section_content { overflow: auto; }
in
#section_content { overflow: visible; }
in order to see if there would be something visible with an indication.
Step 1
http://home.tiscali.nl/developerscorner/css-discuss/test-o-gazetteer-1.htm
Yes! The content is overflowing horizontally, so the hor. scoll bar is
correct. Maybe the image someway? Removed:
Step 2
http://home.tiscali.nl/developerscorner/css-discuss/test-o-gazetteer-2.htm
Not. - O.k., then fundamental measures: removed everything except the
header.
Step 3
http://home.tiscali.nl/developerscorner/css-discuss/test-o-gazetteer-3.htm
Aha! Now it is alright. See if we can add some problems. ;-)
Step by step, first the class='venutitle'.
Step 4
http://home.tiscali.nl/developerscorner/css-discuss/test-o-gazetteer-4.htm
Ha, bingo! What is it? This class has a width of 100% AND a padding-left
of 20px; that is 20px too much. - Bringing the padding back to 0 is
showing that even 100% is too much, because the vertical spacebar has
some horizontal space too. - Some playing is delevering:
.venutitle {
width: 458px;
padding-left:20px;
margin-left: 2px;
}
Testing: Step 5
http://home.tiscali.nl/developerscorner/css-discuss/test-o-gazetteer-5.htm
:-)
--- With respect to the background-colors: maybe a point before the bg0
and bg1 in the css can help? (the css-validator doesn't react on that
missing points!).
Success and greetings,
francky
BTW-1: The fixed very very small font-size is giving
accessibility/usability problems in IE, even for visually 100% people,
espacially at bigger screen resolutions (1280x1024 and more). The
IE-folks cannot enlarge the font-size clientside...
BTW-2: The fixed format model is using only about 30% of the screen
surface at 1280x1024...
BTW-3: The fixed very very small font-size in combination with the fixed
format model is giving accesibility/usability problems in not-IE
browsers as Firefox: if visitors enlarge the font-size, the design is
gone...
All together: you could consider to make a more liquid model, without
fixed font-sizes and without absolute positioned elements: automatically
adapting to the screen and the needs of the visitor.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] css list
Paul Novitski wrote:
At 10/22/2006 09:20 PM, Brian Jones wrote:
I have a 16px x 16px image that I want to set as the background image
of a li how would i go about setting my css to accomplish this
The simple answer is:
li#example
{
width: 16px;
height: 16px;
background: url(something.jpg) left top no-repeat;
}
If the LI also contains text (as perhaps it should, to provide
content in the absence of image support), what's the relationship of
the text to the 16x16 image? Is the text hidden? Does it lie on top
of the image? What happens to that relationship as the text
resizes? Defining the situation in more detail will lead to more
detailed solutions.
Regards,
Paul
... and if you mean graphical bullets instead of the standard black
dots, I've got this one (font-scaling proof) for you:
*
http://home.tiscali.nl/developerscorner/css-discuss/test-graphical-bullets.htm
Success and greetings,
francky
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Help with DIV Dissapearance in IE
http://whitehorsemedia.com/broadcast/wnb/index.cfm The div with the class .episode on the page above is not displaying in Internet Explorer 6. There is a big blank space where the div and it's contents should be instead. Any ideas? Thanks, Aaron __ 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] more than css Zen Garden ?
Bru, Pierre wrote: hi all, css Zen Garden is full of beautifull variations done via css on the same html page. do you know other place like this one ? TIA, Pierre. Yes, this one: http://www.gigastyle.be/ The page is in Dutch, the styles are in css. ;-) The headers translated: Een voorbeeld van wat men kan bereiken met xhtml en css. -- An example of what can be achieved with xhtml and css. (Sidebar right on the starting page!) Gallerij -- Gallery Bronnen -- Sources Links -- Links (Content part) De bedoeling -- The goal (:: make a contribution!) Hoe gaat dat? -- How to do? (:: copy html, make css; submit) Waarom allemaal? -- Why all this? (:: to prove -yourself and the world- that beautiful things can be made without tables) De verwachtingen -- The conditions (:: new design, crossbrowser, valid css, working preview on own site) Standaarden -- Standards (:: links to validators) ... and the yell: Kijk mama, zonder tabellen! -- Look ma, no tables! === Greetings, francky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] more than css Zen Garden ?
francky wrote: Bru, Pierre wrote: hi all, css Zen Garden is full of beautifull variations done via css on the same html page. do you know other place like this one ? TIA, Pierre. Yes, this one: http://www.gigastyle.be/ The page is in Dutch, the styles are in css. ;-) The headers translated: Een voorbeeld van wat men kan bereiken met xhtml en css. -- An example of what can be achieved with xhtml and css. In my FF 1.5.0.7 on Linux, the justified text on their home page suffers from great rivers of white, columns of text fall out the bottom of what appear to be boxes that they're supposed to be in, and in general it looks, umm, cluttered and ugly. And what is it using the Javascript for? -- David [EMAIL PROTECTED] authenticity, honesty, community __ 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] Fading Borders Extending a Column
A big shout out to Georg for solving my previous problem. I now have two questions which a quick search did not reveal CSS-D had answered in a while. I am trying to make fading borders on each side of my webpage. I am currently using a div on the left and right my content, but I have to have text inside the div and it does not extend the entire length of the document. I am also trying to force my right side column to continue to the bottom of the page. However, both firefox and IE do not want to allow it to expand all the way to the bottom. If you go to my link, it is the black box on the right with the links in it. http://smwstudios.com/Martin/ Thanks for the help so far. --Martin __ 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] Fading Borders Extending a Column
Martin... Go read this: http://alistapart.com/articles/fauxcolumns/ Will help you do what you are trying to do. David Merwin [EMAIL PROTECTED] 541-335-1832 http://www.davemerwin.com http://www.purebluedesign.com http://www.betachurch.org http://www.agiprofessional.com On Oct 23, 2006, at 7:06 PM, Martin Davis wrote: A big shout out to Georg for solving my previous problem. I now have two questions which a quick search did not reveal CSS-D had answered in a while. I am trying to make fading borders on each side of my webpage. I am currently using a div on the left and right my content, but I have to have text inside the div and it does not extend the entire length of the document. I am also trying to force my right side column to continue to the bottom of the page. However, both firefox and IE do not want to allow it to expand all the way to the bottom. If you go to my link, it is the black box on the right with the links in it. http://smwstudios.com/Martin/ Thanks for the help so far. --Martin __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Famous CSS/Javascript menuins system
I've been lurking on this list for a while and there is almost always mention of some well known, currently fairly popular CSS (and Javascript I think) dropdown menuing scheme. It has a very catchy name, but it escapes me. Can anyone help me remember it? Thanks, Wes Gamble __ 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] Famous CSS/Javascript menuins system
Hi Wes, Was it Suckerfish? If so, here's the link: http://www.htmldog.com/articles/suckerfish/dropdowns/ Mark On Oct 23, 2006, at 9:51 PM, Wes Gamble wrote: I've been lurking on this list for a while and there is almost always mention of some well known, currently fairly popular CSS (and Javascript I think) dropdown menuing scheme. It has a very catchy name, but it escapes me. Can anyone help me remember it? Thanks, Wes Gamble __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Famous CSS/Javascript menuins system
Wes Gamble wrote: I've been lurking on this list for a while and there is almost always mention of some well known, currently fairly popular CSS (and Javascript I think) dropdown menuing scheme. It has a very catchy name, but it escapes me. Can anyone help me remember it? Thanks, Wes Gamble Suckerfish/Son of Suckerfish http://www.htmldog.com/articles/suckerfish/dropdowns/ Sometimes known as the bane of some designer's existence (personal opinion :-) ). ~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] Famous CSS/Javascript menuins system
I've been lurking on this list for a while and there is almost always mention of some well known, currently fairly popular CSS (and Javascript I think) dropdown menuing scheme. It has a very catchy name, but it escapes me. Can anyone help me remember it? http://css-discuss.incutio.com/?page=ListMenus -- Al Sparber - PVII http://www.projectseven.com Extending Dreamweaver - Nav Systems | Galleries | Widgets Authors: 42nd Street: Mastering the Art of CSS Design __ 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/
