[css-d] Hover state persisting on anchor with target=_blank
http://www.kacevisual.com/files/hover-test/ On hover, link turns orange (CSS :hover). Click link opens in new tab (target=_blank) Now going back to the original tab, if you don't mouse into the page, you'll see the link is still in it's hover state. Default and expected browser behavior IMO, but some people here are wondering if there's a way to have the link revert to the non-hover state automatically. Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] 1-px rule after last p paragraph?
I think an hr / makes the most sense actually. Add left/right margin so it's the correct width. Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Opera Type and Menu issues [+1]
Sadly all browsers have their idiosyncrasies, bugs, or interpret (occasionally vague) HTML/CSS specs differently. Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Webkit Bug...?
Is this a bug in Webkit? Check the 3rd item in the 2nd ordered list (or search for Use the W, A, S, and D): http://na.cityofheroes.com/en/freedom/user-guide/index.php In other browsers the list-item bullet - 3. - is to the left of the image, in Webkit browsers the floated image is to the left of the bullet. I found a work around by enclosing the image and text in a div, and adding a clear div before that parent div's closing tag. ie: li div img style=float:left; src=#.jpg / Lorem ipsum dolor sit amet.. div style=clear:both;/div div /li I tried searching for this, but didn't really find anything (or look that hard either...). Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Opera Type and Menu issues
I also hate the whole-site-zoom effect... It can make sense: text in a small side bar becomes unreadable if there are 3 characters per line. It would be nice if there was a balance, at least so that site was never increased more than the size of the viewport. Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] 'letter-spacing' - pixels only?
I use em all the time, and by that I mean I only use em when letter-spacing.
Just today I used:
p {letter-spacing: -0.08em}
Kevin
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] 'letter-spacing' - pixels only?
Aha! Appears to be browser specific: Gecko - Good! Webkit - Bad! Trident - Good! Preso - Bad! http://www.kacevisual.com/files/letter-spacing/ My disdain for Webkit grows... Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] 'letter-spacing' - pixels only?
I don't think it's a bug, just a poorly defined spec: http://www.w3.org/TR/CSS2/text.html#spacing-props Character spacing algorithms are user agent-dependent. Values may be negative, but there may be implementation-specific limits. It's logged as a bug with Webkit, though 'unconfirmed': https://bugs.webkit.org/show_bug.cgi?id=20606 I have font-smoothing turned off, not sure if UAs would/could handle this differently if it's on...? Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] 'letter-spacing' - pixels only?
Interesting test. Anyway, I would think that there would be a gradient of string length between equally stepped letter-spacing values, so IMO it's a bug in Webkit/Presto. Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Opera Type and Menu issues
I don't really think this should be seen as a bug. Long strings break, unless you used nbsp;... Just make sure your line-heights accommodate, which I'd say they do. Kevin On Wed, Oct 26, 2011 at 3:05 PM, Chris F.A. Johnson ch...@cfajohnson.comwrote: On Wed, 26 Oct 2011, John wrote: http://coffeeonmars.com/**testing/index.htmlhttp://coffeeonmars.com/testing/index.html http://coffeeonmars.com/**testing/WPR_Wire.htmlhttp://coffeeonmars.com/testing/WPR_Wire.html When Opera 11.51 opens these pages, the H1/H2 headline is bigger/fatter and breaks whereas all other browsers (Even pesky win IE6) don't do this to my type. Opera also does weird things with the menu at the left, where next in project gets so large it takes up 2 lines. The H1 also breaks in Firefox because, like many people, I use a larger font-size than you do: http://b.cfaj.ca/**coffeeonmars.jpeghttp://b.cfaj.ca/coffeeonmars.jpeg . -- Chris F.A. Johnson, http://cfajohnson.com/ Author: Pro Bash Programming: Scripting the GNU/Linux Shell (2009, Apress) Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress) __**__**__ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/**mailman/listinfo/css-dhttp://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.**com/http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/**policies.htmlhttp://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_**support_evolt/http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Best way to add image elements?
float:left wont work..? (being sure to clear the containing/red bordered div) Kevin On Wed, Oct 26, 2011 at 4:09 PM, John j...@coffeeonmars.com wrote: http://coffeeonmars.com/testing/pix/widgets.jpg I am not sure how to implement this idea, shown at the link above. the image elements are within the red line. My guess is that it should be within the content area, but it can't push anything else around...IOW, its positioning shouldn't affect the positioning of what's already there, if that makes sense..the reason being that if I need to remove one of all of the image elements, the rest of the layout will stay put. would this be done by creating a div for the first image, set its positioning by margin values, then rinse and repeat for as many other images I want to add horizontally? Thank you! John __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Opera Type and Menu issues
Browser preference. Most browsers now-a-days zoom the entire site (layout, graphics and all) not just text. I know in FF you can specify text only zoom. Apple looks to use JS or CSS transitions to scale up some layout elements as well. The line break due to font-rendering differences in different browsers could be resolved with white-space:nowrap;. Check if browser support meets your needs. Kevin On Wed, Oct 26, 2011 at 4:28 PM, John j...@coffeeonmars.com wrote: On Oct 26, 2011, at 3:05 PM, Chris F.A. Johnson wrote: The H1 also breaks in Firefox because, like many people, I use a larger font-size than you do: http://b.cfaj.ca/coffeeonmars.jpeg. OK..well, how does a site like Apple.com prevent the local browser's font size setting from altering the type on their page. *and I am talking about actual, live type, and not the type on their site that's raster graphics. if you zoom on the apple.com page, everything gets bigger together. what's the trick to doing that? Is this something members on this list do for their pages to preserve the type relationships regardless of what the end user does with their browser? thank you! John __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] help with positioning text in bottom right corner of content area
Try making the parent element position relative, and the AF element position absolute, bottom:0, left:0. Kevin On Fri, Oct 21, 2011 at 2:15 PM, Angela French afre...@sbctc.edu wrote: I need to position a very small text item in the bottom right hand corner of my content area. I've tried positioning it relative with bottom:0 and right:0, but that didn't work. So then I just positioned it like so: p style=position:relative;bottom:0;left:100%;AF/p. This does move it to the right, but not to the bottom of my page content area. I can't determine what is keeping it from sitting on the bottom. Any advice appreciated. Here is my test page: http://sbctc.edu/college/test.aspx Angela French Internet Specialist State Board for Community and Technical Colleges 360-704-4316 afre...@sbctc.edu http://www.checkoutacollege.com/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] help with positioning text in bottom right corner of content area
Oops, left:0 should be right:0. Kevin On Fri, Oct 21, 2011 at 2:29 PM, Kevin A. Cameron kevinacame...@gmail.comwrote: Try making the parent element position relative, and the AF element position absolute, bottom:0, left:0. Kevin On Fri, Oct 21, 2011 at 2:15 PM, Angela French afre...@sbctc.edu wrote: I need to position a very small text item in the bottom right hand corner of my content area. I've tried positioning it relative with bottom:0 and right:0, but that didn't work. So then I just positioned it like so: p style=position:relative;bottom:0;left:100%;AF/p. This does move it to the right, but not to the bottom of my page content area. I can't determine what is keeping it from sitting on the bottom. Any advice appreciated. Here is my test page: http://sbctc.edu/college/test.aspx Angela French Internet Specialist State Board for Community and Technical Colleges 360-704-4316 afre...@sbctc.edu http://www.checkoutacollege.com/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Is padding-left Inherited?
It's an inline style in the markup. Also probably want to try to pick away at the HTML errors, there's a lot! Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Best Practices For Sprites?
You also have to consider bandwidth vs likelihood of the image being required. I had been putting together a sprite of hundreds of icons. This image ended up being very large, and didn't make sense for every user to download all these images when perhaps they only needed 1. I ended up breaking the mega-sprite into 10 smaller sprites, grouping the icons by association. Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] apply class to parent when children are in focus?
Looks like there is some JS that is adding class 'selectedanchor' on hover. Just modify that class to also have white text. If you're looking to recreate something like this with just CSS, maybe check http://css.maxdesign.com.au/listamatic/ Kevin On Thu, Sep 22, 2011 at 8:37 AM, Debbie Campbell d...@redkitecreative.comwrote: In this page: http://kittymunson.com/acbl/**newsite/clubs/acblscore.php#http://kittymunson.com/acbl/newsite/clubs/acblscore.php# If you click on the Learn Improve tab, then on any of the menu items with a , you'll see the parent item changes to white with a colored background. But if you mouse down into the menu, the parent item returns to a dark color. How would I keep the white text color in the parent while the user is mousing over the menu? -- Debbie Campbell www.redkitecreative.com __**__**__ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/**mailman/listinfo/css-dhttp://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.**com/http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/**policies.htmlhttp://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_**support_evolt/http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Expand parent width to contain floated elements
Pretty sure if you float the parent, it will grow to fit the content. Kevin On Fri, Sep 16, 2011 at 8:40 AM, Stevio redea...@freeuk.com wrote: Hi is there a way to expand the width of a parent container so that it fits the contents of the floated elements within it? If I have two floated elements within a parent element, and the width of those two floated elements can change depending on their content, I would like the width of the parent element to expand to contain them. At the moment, the floated element would stick out the right of the container. Thanks. __**__**__ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/**mailman/listinfo/css-dhttp://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.**com/http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/**policies.htmlhttp://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_**support_evolt/http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Form styling: best practices
Check how they do it on http://wufoo.com/ - a popular form builder. Kevin On Thu, Sep 15, 2011 at 12:42 AM, Jukka K. Korpela jkorp...@cs.tut.fiwrote: 15.9.2011 6:29, Dark Phoenix wrote: I want to be able to add hints to any form elements that may need them, and have them only show up when they're needed (using some sort of hover mechanism). That's an interesting and important issue but largely outside the scope of CSS. Or, rather, just a part of it is CSS, and the design issue and other implementation issues need to be solved first, before the CSS aspects can be discussed. In design, CSS considerations may be important, because the impossibility or difficulty of doing some things in CSS may affect the design choices. But I don't think that's the case here. I do know that I'm going to indicate errors with a popup on the right side of the form element (that shows up when the element is focused or the error icon which will appear on the right side of the field is hovered), so I'm not sure if putting the information indicator to the right of the element is the right move. Well that's a design issue too, but styling may help: if you use the same notification area for both status information and error messages, you could style it differently depending on contents. For example, error messages with red borders and yellow background. Instead of popup, it has become more common to use information areas that become visible or change content as controlled by JavaScript and CSS. (Popups may annoy people, may get blocked etc.) Yet another possibility is to use iframe for them, as that way things can work without JavaScript. I don't want to start a discussion on such design issues in this list - just mention a few of alternatives, to illustrate why it's too early to discuss CSS aspects - the different approaches have rather different CSS implications. -- Yucca, http://www.cs.tut.fi/~**jkorpela/ http://www.cs.tut.fi/~jkorpela/ __**__**__ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/**mailman/listinfo/css-dhttp://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.**com/http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/**policies.htmlhttp://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_**support_evolt/http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Dropdown Menu Hover Link Sticks
What ver of browsers? On FF 3.6 it's not sticking (and by sticking I assume you mean the drop down stays even after mouseout), though it does seem to be unresponsive - ie the drop down takes a little work to get it to show... Kevin On Wed, Sep 14, 2011 at 4:13 PM, Mary Villanueva mvilla5...@gmail.comwrote: Hello! Can anyone tell me why the hover link in a CSS drop-down menu sticks in Firefox and Safari? Can it be fixed? It's working fine in IE9 which is surprise. Here's the website - I'm still putting the template together: http://www.byronsbyte.com/SPCA_SanPat/ Go to the SPCA Services Navbar (the orange one) and you'll be able to see how all the links stick. Here's the stylesheet: http://www.byronsbyte.com/SPCA_SanPat/CSS/spca_global.css Thank you for your kind assistance. Best regards, Mary __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Pure CSS Drop Down Menu Help
Something along the lines of
#main-nav li:hover ul {display:block;}
should help. May also want to check the support for the :hover pseudo
element on LIs to make sure it accommodates your audienc (
http://www.quirksmode.org/css/contents.html).
Kevin
On Fri, Sep 9, 2011 at 9:46 AM, Elli Vizcaino elli...@yahoo.com wrote:
Hello CSS Discuss,
I have a site all coded up and the only besides cross browser checking left
to do is integrate a drop down behavior to one of the menu items: About. I
found a couple of articles and I can't the sub menu to work and drop when
one hovers over About. I have tried the methods in the following two
articles:
http://www.htmldog.com/articles/suckerfish/dropdowns/ - the code semi
works for this one with the exception that once the sub menu drops down once
and is hovered over again, it won't stay open if you try to hover over it
again the second time around.
So I then decided to give this one a try:
http://matthewjamestaylor.com/blog/centered-dropdown-menus -even though my
menu isn't center aligned thought I could still incorporate the part for the
drop down behavior but I can't get that one to work either.
Please take a look here for the coded page and try hovering over About -
nothing happens: http://e7flux.com/dfd/index.html
Here is the snippet of code related to the navigation:
#main-nav {
overflow: hidden;
margin-top: 106px;
padding: 0 98px;
}
#main-nav li {
float: left;
list-style-type: none;
font-family: Arial, Helvetica, sans-serif; /* Whitney Medium */
font-size: 12px; /* 14pt in Whitney Medium */
text-transform: uppercase;
color: #FFF;
}
#main-nav li.home, #main-nav li.about {
margin-right: 72px;
}
#main-nav li.about a {
display: block;
}
#main-nav li.get-involved {
margin-right: 326px;
}
#main-nav li.blog, #main-nav li.donate {
margin-right: 72px;
}
#main-nav a {
color: #FFF;
font-style: normal;
}
#main-nav a:hover {
color: #023f3b;
background: none;
}
#main-nav li ul#sub-nav {
display: none;
position: absolute;
right: auto;
background: url(../images/subnav-bg.png) no-repeat;
margin-top: 3px;
width: 117px;
height: 136px;
padding: 11px 15px 0;
}
#main-nav li ul#sub-nav li {
margin: 0 0 9px;
left: auto;
}
#main-nav li ul#sub-nav, #main-nav li ul#sub-nav a {
font-family: Georgia, Times New Roman, Times, serif;
font-size: 12px;
font-style: italic;
text-transform: none;
color: #0c4440;
}
#main-nav ul#sub-nav a:hover {
background: url(../images/link-hover-bg.png) bottom repeat-x;
}
If anyone can help I'd greatly appreciate it - this is due today and this
is the one issue that is holding me up!!! I am working off of FF3.6
TIA,
Elli Vizcaino
Web Designer Developer
http://www.E7Flux.com
The Best Compliment We Can Receive Is A Referral!
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] converting frame style website to tables and css
Most people nowadays use something like lightbox, thickbox or fancybox (there must be a generic term for these...?), these use JS to open a large image in an overlay (similar to clicking an image in a status feed on Facebook). We use fancybox quite a bit here: http://fancybox.net/ The markup is extremely simple: a href=link to full size imageimg src=thumbnail //a Kevin On Fri, Sep 9, 2011 at 10:58 AM, Brahm Friedlander brahmf...@gmail.comwrote: This is my first post. In the past I've used frames to make web sites. My site - http://www.brahmfriedlander.ca uses frames. Other artists have asked me to make similar sites for them but I know frames are not the way to go and css is. How would I go about creating a site with the same features as mine i.e. displaying photos on a split screen rather than having thumbnail opening to large jpg on different page. Being new to this site and css and web design in general I hope this is not too outrageous a request. Best regards, Brahm brahmf...@gmail.com http://www.brahmfriedlander.ca http://www.brahmfriedlander.ca/ br...@brahmfriedlander.ca __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] strong text in different color?
#5 would be the way I'd do it. There was a great presentation (by Nicole Sullivan) posted here last week about the difficulties of specificity war in CSS. Keep your selectors' specificity as low as possible. Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Trick to Reduce Image File Size
Could be considered OT, but front end devs are usually chopping images in their day to day, and this trick has become standard practice for me. Using the posterize layer effect (in Photoshop) will let you constrain the number of unique colour values. For example instead of an image having 200 different unique colour values, you can limit it to 100 or whatever, and still save as a PNG-24. Eg http://www.kacevisual.com/files/img-test/not-posterized.png - 14.19KB (256+ colours) http://www.kacevisual.com/files/img-test/posterized.png - 5.94KB (40 colours) http://www.kacevisual.com/files/img-test/compare.tif - both, can you tell which is which? There are certainly many other tricks to reduce image file size, but this is just so easy and almost always makes a huge difference. Another step can be to duplicate the layer, posterize 1, and use the other with a mask to fill in the areas where you can see steps between the colours (often in a gradient). Further reading: http://www.smashingmagazine.com/2009/07/15/clever-png-optimization-techniques/ Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS Organization
My favourite part from that presentation was when she said (paraphrased) what's between the brackets is trivial, it's the selectors that are the tricky part. Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS Organization
I'm guessing that was preprocessors, the likes of LESS or SASS. Kevin On Wed, Aug 31, 2011 at 10:53 AM, Tim Dawson t...@ramasaig.com wrote: On 31/08/2011 17:34, Kevin A. Cameron wrote: My favourite part from that presentation was when she said (paraphrased) what's between the brackets is trivial, it's the selectors that are the tricky part. Kevin The talk was interesting, but the camera work poor. Too much presenter, it was difficult to see the slides. Did anyone catch what she talking about towards the end; it sounded like 'pre-' something. Tim -- Tim Dawson Maolbhuidhe Fionnphort Isle of Mull PA66 6BP 01681 700718 __**__**__ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/**mailman/listinfo/css-dhttp://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.**com/http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/**policies.htmlhttp://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_**support_evolt/http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] can style sheets be too long?
Nice! And thanks Tim for the clarification, I'll definitely be incorporating that syntax in future projects. Kevin On Thu, Aug 25, 2011 at 6:06 PM, John j...@coffeeonmars.com wrote: On Aug 25, 2011, at 9:10 AM, Kevin A. Cameron wrote: +1 for the OOCSS mentality...Start with a base class that defines the most common use, then use additional classes in conjunction with the base class to define the variations. this is working *very* well for me, both solving problems and giving me flexibility at the same time. I re-named my styles improving their descriptiveness and with CamelCase, the whole thing much easier to read and make sense of. J __**__**__ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/**mailman/listinfo/css-dhttp://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.**com/http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/**policies.htmlhttp://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_**support_evolt/http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Off-topic : h1 replacement -- which one is recommended?
I'm guessing this is referring to replacing text with a (background) image..? Kevin On Fri, Aug 26, 2011 at 9:20 AM, Philip TAYLOR (Webmaster, Ret'd) p.tay...@rhul.ac.uk wrote: Scott Hamm wrote: I've been looking all over websites -- a lot of good h1 replacement suggestions. But which one is more practical, validated in all aspects i.e. bobby approved, html5, etc? H1 is HTML, not CSS, but that said, why might anyone want to replace it ? Philip Taylor __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] can style sheets be too long?
+1 for the OOCSS mentality.
A simple example: lets say you have 3 types of linked headers. Start with a
base class that defines the most common use, then use additional classes
in conjunction with the base class to define the variations.
/* Default linked header */
.headerLink {
text-decoration: none;
font: 1.2em/1 tahoma, sans-serif;
color: red;
}
.headerLink a:hover {
text-decoration: underline;
}
/* Alternate linked header 1 */
.headerLink-alt1 {
color: blue;
}
.headerLink-alt1 a:hover {
background-color: yellow;
}
/*Alternate linked header 2 */
.headerLink-alt2 {
color: orange;
font-size: 2em;
}
h1 class=headerLinka href=#default header/a/h1
h1 class=headerLink headerLink-alt1a href=#alternate header
1/a/h1
h1 class=headerLink headerLink-alt2a href=#alternate header
2/a/h1
At least that's how I think it would apply in the context of this
conversation.
Kevin
On Thu, Aug 25, 2011 at 2:52 AM, Ghodmode ghodm...@ghodmode.com wrote:
On Thu, Aug 25, 2011 at 5:29 AM, John j...@coffeeonmars.com wrote:
As I evolve my site, I'm differentiating styles by altering the name so
that
I can adjust attributes.
example: home page head and sub-page head might be mostly the same, but
one
might need different positioning or color.
can my style sheet get too long? It only measures about 2K in size right
now, but what if it got to a whopping 16K?
As far as I know, there's not a limitation on the size. As Philippe
Wittenbergh, mentioned, Internet Explorer limits the number of rules
to 4095 and the number of stylesheets to 31 (not 32).
Here are a couple of links that refer to this limitation in IE:
-
http://social.msdn.microsoft.com/Forums/en-US/iewebdevelopment/thread/ad1b6e88-bbfa-4cc4-9e95-3889b82a7c1d/
- http://support.microsoft.com/kb/262161
is that a big concern, or is the human angle a bigger deal in terms of
keeping everything straight?
It's annoying when IE imposes a limitation on us that none of the
other browsers do, but I think that almost all sites should fit within
the 31/4095 limit.
Having said that, I have run into the stylesheet limitation on a large
Django-based site with lots of developers working on lots of different
parts of the site. But the problem only happened in development
because we minified and combined the stylesheets before pushing into
production. Also, there was a lot of room for optimization of all of
the code that would have eliminated the problem entirely.
Something that might help is the concept of Object-Oriented CSS which
was presented by one of the Yahoo developers.
The GitHub Wiki:
- https://github.com/stubbornella/oocss/wiki
The presentation:
-
http://www.stubbornella.org/content/2009/03/23/object-oriented-css-video-on-ydn/
Or just the slides:
- http://www.slideshare.net/stubbornella/object-oriented-css
thanks!
J
--
Ghodmode
http://www.ghodmode.com/blog
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] OperaMini
Had this issue a while back and I believe it was related to a meta tag. I googled this article - might be of help http://dev.opera.com/articles/view/an-introduction-to-meta-viewport-and-viewport/ Kevin On Thu, Aug 25, 2011 at 3:48 AM, David Laakso da...@chelseacreekstudio.comwrote: Greetings from San_Miguel de Allende... We've got ourselves a whittle problem on this site[1] that is driving us nuts... In OperaMini landscape view the font-size, for some unknown reason, is larger and requires a page reload to correct. This does not happen in landscape view in Android/2.2.2 nor in Opera Mobile. What to do? [1] markup http://chelseacreekstudio.**com/ http://chelseacreekstudio.com/ css http://chelseacreekstudio.**com/site/css/sisu.csshttp://chelseacreekstudio.com/site/css/sisu.css Best, Milagros Sanchez Creative Director Mexico __**__**__ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/**mailman/listinfo/css-dhttp://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.**com/http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/**policies.htmlhttp://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_**support_evolt/http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] can style sheets be too long?
In an attempt to head off a flame war I'll say it completely depends on your audience. Many corporate internal websites depend on IE6, as well some developing nations are using it (on older systems). Majority of all others are using newer browsers.. Kevin On Thu, Aug 25, 2011 at 1:47 PM, Greg Wilker jer...@well.com wrote: -Original Message- From: Tim Climis Sent: Thursday, August 25, 2011 1:12 PM Subject: Re: [css-d] can style sheets be too long? This might be nitpicking but wouldn't it be more like this? (Or is this one of the cases that makes IE6 choke and die?) I've been thinking that developing with IE6 in mind is in the past - my experience and data shows that people using IE/Windows have left IE6. Windows has been diligent in including browser upgrades as part of its important software updates. Are people seeing data contraire to this? Inquiring minds, Greg __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] getting an image in back of text (z-index)
Maybe this has been asked, but why not use a BG image? Kevin On Wed, Jul 27, 2011 at 2:36 PM, John j...@coffeeonmars.com wrote: On Jul 26, 2011, at 10:29 PM, Mark Henderson wrote: Honestly John, all things considered, I recommend /starting over/ and to that end if you can take the time to create and upload a graphical representation of what you want the page to look like, someone here (including myself) can probably get you heading in the right direction. Here is a jpg I've uploaded, taking you up on your generous offer. I worked up 1 design with 2 pages/variations. http://www.coffeeonmars.com/**testing/grafrep.jpghttp://www.coffeeonmars.com/testing/grafrep.jpg I sure do appreciate any tips you can offer on the right way to start this thing out...then maybe I can use that to learn from that point. John __**__**__ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/**mailman/listinfo/css-dhttp://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.**com/http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/**policies.htmlhttp://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_**support_evolt/http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] clumpy loading
Looks like there are a bunch of images are aren't being found, which would certainly slow the load. subpage1_01.jpg and the like... Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] tables in print.css file
Shouldn't there be a space before the '!' ? Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] tables in print.css file
Are you testing by looking at a physical printout or a PDF? Sometimes a light grey wont be noticeable in print. You've set the media type in the style sheet link? eg: LINK REL=stylesheet TYPE=text/css MEDIA=screen, print HREF=foo.css Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] vertically align two floated divs to top of container
Remove the br between the 2 divs with class wpcol-one-half halfColumn Kevin On Tue, May 24, 2011 at 4:40 PM, Debbie Campbell d...@redkitecreative.comwrote: Can someone tell me what I need to fix to get the two yellow divs to align to the top of the blue-bordered div? http://hachdrinkingwater.com/ -- Debbie Campbell www.redkitecreative.com __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] can someone explain?
Oh LOL! Serves me right for using an ol... Kevin On Tue, May 17, 2011 at 5:44 PM, Philippe Wittenbergh e...@l-c-n.comwrote: On May 18, 2011, at 9:26 AM, Kevin A. Cameron wrote: While testing I came across this weird bug/artifact. the contents of the ol lis (1 2 3) are shown twice: http://www.kacevisual.com/files/float-test/float-test.html Does anyone understand why? They are not really rendered twice. Change the textual contents of your ol li elements to read ‘x’ ‘y’ ‘z’ instead of ‘1’ ‘2’ ‘3’ and you’ll see what is happening. The first digit you see in your test case is the list marker, the second one is the textual content of the li. Philippe -- Philippe Wittenbergh http://l-c-n.com/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] can someone explain?
I think this makes sense. Because the lis are floated the uls have 0
height, so they both start at the same location. When you add negative
margin to the first li it's pulled above the containing ul. The second
li when floated left only sees the beginning of the ul and then is
pulled up, and thereby overlapping.
I'm sure someone here knows more about box model implementations by browsers
and could provide a more technical answer.
Kevin
On Tue, May 17, 2011 at 12:13 PM, Sara Haradhvala har...@comcast.netwrote:
Hi Jim,
Margins and padding are 0.
Here is the HTML:
div id=menu
ul
li
a href=#a1/a
a href=#a2/a
/li
/ul
ul
li
a href=#b1/a
a href=#b2/a
/li
/ul
/div
The CSS is:
* {margin:0; padding:0}
#menu {margin-top:20px}
ul {list-style:none}
ul * {float:left;}
li {margin-top: -20px}
Thanks,
Sara
On May 17, 2011, at 2:11 PM, JWN wrote:
Morning Sara
You wrote
Hi,
I have two unordered lists, where each list has 1 list item with 2
links. If I float the list items and anchors left, all 4 anchors line up
horizontally as expected. If I add a margin to the list items (but not the
anchors), all anchors move down and are still horizontally lined up as
expected. But if I put a negative margin on the list items instead, the
anchors move up as expected, but the anchors from the 2nd list overlay the
anchors from the first list instead of sitting to the right of them. I'm not
understanding why this is, and hope someone can explain.
I'm using firefox 4 on the Mac.
Thanks,
Sara
Just a guess but you might try zeroing out margins and padding on the
body.
body {
margin:0;
padding:0;
}
Can you provide a link to an actual page or at least a test page showing
the problem? It's always easier to help when we can see what is going on
with the rest of CSS / xHTML.
Best
Jim Nannery
www.oldcurmudgeon.net
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] can someone explain?
While testing I came across this weird bug/artifact. the contents of the
ol lis (1 2 3) are shown twice:
http://www.kacevisual.com/files/float-test/float-test.html
Does anyone understand why?
Kevin
On Tue, May 17, 2011 at 5:04 PM, Sara Haradhvala har...@comcast.net wrote:
Thanks so much for the explanation, Kevin. What you're saying totally
makes sense! And it explains why that negative margin acts differently from
the positive margin (in the latter case, the 2nd li bumps into the margin).
But I'm wondering why putting a1px border on the list elements makes the
anchors align - even with the negative margin. The uls are still zero
height.
Sara
On May 17, 2011, at 6:58 PM, Kevin A. Cameron wrote:
I think this makes sense. Because the lis are floated the uls have 0
height, so they both start at the same location. When you add negative
margin to the first li it's pulled above the containing ul. The second
li when floated left only sees the beginning of the ul and then is
pulled up, and thereby overlapping.
I'm sure someone here knows more about box model implementations by
browsers and could provide a more technical answer.
Kevin
On Tue, May 17, 2011 at 12:13 PM, Sara Haradhvala har...@comcast.netwrote:
Hi Jim,
Margins and padding are 0.
Here is the HTML:
div id=menu
ul
li
a href=#a1/a
a href=#a2/a
/li
/ul
ul
li
a href=#b1/a
a href=#b2/a
/li
/ul
/div
The CSS is:
* {margin:0; padding:0}
#menu {margin-top:20px}
ul {list-style:none}
ul * {float:left;}
li {margin-top: -20px}
Thanks,
Sara
On May 17, 2011, at 2:11 PM, JWN wrote:
Morning Sara
You wrote
Hi,
I have two unordered lists, where each list has 1 list item with 2
links. If I float the list items and anchors left, all 4 anchors line up
horizontally as expected. If I add a margin to the list items (but not the
anchors), all anchors move down and are still horizontally lined up as
expected. But if I put a negative margin on the list items instead, the
anchors move up as expected, but the anchors from the 2nd list overlay the
anchors from the first list instead of sitting to the right of them. I'm not
understanding why this is, and hope someone can explain.
I'm using firefox 4 on the Mac.
Thanks,
Sara
Just a guess but you might try zeroing out margins and padding on the
body.
body {
margin:0;
padding:0;
}
Can you provide a link to an actual page or at least a test page showing
the problem? It's always easier to help when we can see what is going on
with the rest of CSS / xHTML.
Best
Jim Nannery
www.oldcurmudgeon.net
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Drop Cap missing in FF4
Would the :first-letter pseudo class work?
Kevin
On Wed, May 11, 2011 at 12:53 PM, Lesley Lutomski
c...@islaywebdesign.co.ukwrote:
Hi all,
I have a site which uses drop caps at the start of some pages. The code
for this is taken more or less straight out of Dan Cederholm's Web
Standards Solutions, apart from the font-family line.
span class=dropA/span
.drop {float: left;
font-size: 300%;
line-height: 1em;
margin: 4px 10px 0px 0;
padding: 4px 10px;
border: 2px solid #3F006F;
font-family: ChromaSSK, Georgia, Times New Roman, Nimbus Roman
No9 L, serif;
background-color: #FF;
}
In FF4 on Linux, the drop cap doesn't display when the first font in the
list is not available, even though the other fonts are all installed. The
coloured background and the border are displayed, but the letter itself is
missing. Chromium and Epiphany both display it using the first available
font. I can't test in anything else just now.
Any ideas why this is happening? I'm probably missing something obvious.
HTML CSS both validate.
Thanks.
Lesley
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE 6 /5.5 problem
IE5.5 and 6?!?! Kidding, kidding (but not really). I'd try defining those widths in px, instead of em. Kevin On Mon, Apr 25, 2011 at 2:23 PM, Sol Sinclair s_sincl...@sympatico.cawrote: Hi all; I am having trouble with a float drop in IE 5.5 and 6 -- don't know about IE7, as I don't have that. Right now, I want to get it looking right in 5.5 and 6 (IE). The page is at: http://www.robertsmart.ca/ZZnew/index.html I don't know why the #content is not floating up beside the #menu. There is more than enough room for it to sit there. It is inside #wrapper which contains both #menu and #content (both floated left. Can someone please let me know what bug this is so i can find a solution. Thanks in advance. I appreciate you help. Sincerely, Sol Sinclair __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] padding in vertical menu
line 250 of style.css
.left_primary p, #subcontent li {
1. padding: 0 0 0.675em 0;
}
That might be your problem.
Kevin
On Fri, Apr 22, 2011 at 1:35 PM, Martin mhe...@gmail.com wrote:
Hi there,
I'm trying to do a vertical menu. The thing I'm struggling with is that
there is some padding/margin between the li elements. How can I get rid of
it?
I'm no expert on css, but there shouldn't be any padding there:)
Here's the page in question:
http://www.slackword.net/am/qualifications.html
It's at the bottom on the left hand side.
thanks
regards
Martin
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] problem with overflow: visible under IE8 resizing the containing node
Is the doctype on line 1? Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Reflection effect
This raises an interesting question: the reflected text in HTML or CSS?
Arguments could be made both ways: In CSS is good as it is a visual flourish
(not content). In HTML is good as then it keeps the CSS generic/reusable.
Perhaps this is a good use of an inline style (for the
content:blahportion). Oh wait, you can't do an inline style for a
pseudo element, can
you...?
Kevin
On Fri, Apr 15, 2011 at 11:42 AM, Alan Gresley a...@css-class.com wrote:
On 16/04/2011 4:16 AM, Tim Climis wrote:
Yeah... I was about to point out the same thing. A 180 degree
rotation is not the same as a vertical reflection. The e should be
below the e, not the s.
Really, to get the desired effect, you'd want transform: scaley(-1);
It works in webkit. Haven't tried anything else.
---Tim
This is to simple. Sorry Gabriele. Try the below and the text is truely
mirrored. Also you don't need another element.
!DOCTYPE html
style type=text/css
h1 {
text-align: center;
font-size: 200%;
font: normal 6em Impact, sans-serif;
position:relative;
line-height: 0.9;
color: #333;
}
h1::after {
-webkit-transform: rotateX(180deg);
left:0;
right:0;
top: 100%;
position:absolute;
content: 'Test';
color: #999;
opacity: 0.3;
}
/style
h1Test/h1
--
Alan http://css-class.com/
Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS navigation/menu/selection
Check out this: http://www.kacevisual.com/files/CSSContentSlide/ http://www.kacevisual.com/files/CSSContentSlide/Something I put together to emulate a Flash site a client had asked me to recreate. It uses a single div with a fixed height with overflow:hidden, and the content in divs with page jumps. Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS navigation/menu/selection
Thanks all :) Definitely imperfect, which I'll correct sometime when I get my portfolio up and together. Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Drop Down Menu Issue with IE8
Have a link to a working example? Would be easier to trouble shoot. Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] how the page comes up in IE
258KB is pretty large for a BG image. Saving as a medium jpg in PS, brings it down to 15KB with acceptable quality. http://i.imgur.com/WPVSm.jpg Kevin On Thu, Mar 31, 2011 at 11:52 AM, Sandy sfeld...@sympatico.ca wrote: hey all, I have a problem in ie that I hope you can help with http://burlmannconstruction.com/test/ http://burlmannconstruction.com/test/css/burlmann.css the client is bothered by how the site comes up. Sometimes the background image loads right away, other times you see a flash of solid gray background colour before it comes up. also, intermittently the #wrapper div displays right at the top of the screen and then pops down 20px to where it goes. Is there anything I can do about that? Thanks, Sandy __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Web Pages Shift
I think this is acceptable and expected behaviour, and not something that
needs to be 'fixed'. But to each their own... :)
Kevin
On Wed, Mar 30, 2011 at 10:20 AM, David Hucklesby huckle...@gmail.comwrote:
On 3/30/11 12:57 AM, Markus Ernst wrote:
Am 30.03.2011 09:25 schrieb PL:
Bob,
[...]
html, body { height: 100%; margin: 0 0 1px; padding: 0; }
But I will do a bit of research to discover what this is all
about.
It is not too complicated:
[...]
- The CSS rules you provide give the page a height of 100% of the
viewport, + a margin of 1px, which makes a total height of 1px more
than the viewport height. Like that you force a scrollbar even if
there would be none necessary.
Another possibility that works slightly differently, giving a ghost
scroll bar on short pages (like in IE) -
html {
overflow-y: scroll;
}
--
Cordially,
David
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Same CSS, Same Browser But Looks Different Locally/Online
Wait, are you comparing the preview in Dreamweaver to what you see in a browser? I don't use Dreamweaver, but IIRC the appearance of the preview should be taken with a grain of salt, and to look at the page in whatever browsers you are planning to support. Kevin On Thu, Mar 24, 2011 at 11:45 AM, Chetan Crasta chetancra...@gmail.comwrote: Install Firebug and then inspect the CSS that is applied to the elements in question. Regards, Chetan Crasta __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] ie display problem
- Try floating the img left, and add something to clear the parent div. - Or putting the cork board before the image, which seems contrary to normal flow, but with the cork board floated right, the img shouldn't bump down. Kevin On Thu, Mar 24, 2011 at 1:26 PM, Rory Bernstein r...@rorybernstein.comwrote: On 3/23/11 5:28 PM, Rory Bernstein wrote: On this page: http://motherloadshow.com/ There is a div called id=bulletin_board that should display an image of papers pinned to a cork board ... Thanks, Rory Philip Taylor kindly sent me this screenshot showing how the bulletin board content gets shifted vertically downward (see URL below). That box with the cork background and text that says, this hilarious... should be up directly above where it shows up in the screenshot, in the dark blue box. http://rorybernstein.com/motherload_ie_problem.jpg There have been a few responses about this problem, but no solution yet. : ( Can anyone tell me what is wrong with the code that makes the bulletin board move down in some versions of IE? Thanks again! Rory __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE Background Position
So looks like it was an issue with overflow: hidden and text-indent.
IE8 still considers the element to be be large enough to enclose the text,
so the background-position: right 0 means the BG is off screen. Adding an
IE7 *+html {overflow:visible} fixed the issue for this browser.
Fixed version up if anyone's interested :) Comments/criticism always
appreciated.
http://www.kacevisual.com/files/Anime-Planet/drafts/lovehate/lovehate.html
Kevin
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Ignore white-space between inline and/or inline-block elements in WebKit
Could float:left; each span.
Kevin
On Sat, Mar 19, 2011 at 6:16 AM, Jarek Foksa ja...@kiwi-themes.com wrote:
Perhaps something with the flex-box model might help you?
for example: http://help.dottoro.com/lckcfgbc.php
there are many more examples floating around.
Thanks, this seems to be the most elegant solution. The only caveat is
that the children must be either block-level elements or have display
set to block in CSS.
div class=text
divA/div
divB/div
divC/div
/div
.text {
display: -webkit-box;
}
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE Background Position
Oops, wacky Doctype. Updated with same results: http://www.kacevisual.com/files/Anime-Planet/drafts/lovehate/lovehate.html Kevin On Fri, Mar 18, 2011 at 8:51 AM, G.Sørtun gunla...@c2i.net wrote: On 18.03.2011 06:05, Kevin A. Cameron wrote: Can someone explain why the background image of the right button is not showing correctly in certain versions of IE? http://www.kacevisual.com/files/Anime-Planet/drafts/lovehate/lovehate.html For that page all IE versions are in quirks mode, and have the same missing right bg-image. Trigger standards mode first, and then test. regards Georg __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE Background Position
Thanks John, Anyone using IE7? Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] IE Background Position
Can someone explain why the background image of the right button is not showing correctly in certain versions of IE? http://www.kacevisual.com/files/Anime-Planet/drafts/lovehate/lovehate.html In most other browsers the buttons line up correctly : http://i.imgur.com/eRUyT.png Works in IE9, but not IE8 (from what I've been told), though works in IE9 with IE8 browser mode, but not when in IE7 mode. Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] open blockqoute issue - open and close qoutes placement issue resolved/code coming soon
In most cases, the best practice is to leave line-height unitless, ie line-height:1.3; Some info from the legendary Eric Meyer himself: http://meyerweb.com/eric/thoughts/2006/02/08/unitless-line-heights/ Kevin On Wed, Feb 2, 2011 at 12:42 PM, Matthew P. Johnson i...@ecoitsf.comwrote: -Original Message- From: css-d-boun...@lists.css-discuss.org [mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of ?? Sent: Wednesday, February 02, 2011 11:34 AM To: Matthew P. Johnson Cc: css-d@lists.css-discuss.org Subject: Re: [css-d] open blockqoute issue Yeah, Philippe is right. put line-height: 1.3em; or line-height: 130%; in the blockquote CSS selector then you know what to do later. Wish it works! Best ~d [Matthew P. Johnson] OK I think I have it. Let me format the sucker and I will up the changes. Thanks guys/girls. :) __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Need some CSS help
You need a doctype. try: !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd; Needs to be on LINE ONE of all html pages. Kevin On Tue, Feb 1, 2011 at 3:46 PM, Mark Collins msheek...@gmail.com wrote: Okay I did that and now it shows up fine in IE7 except my fonts are extremely huge... I've tried editing the CSS to no avail. Thanks, Mark On 1/27/2011 6:31 PM, Kevin A. Cameron wrote: Not to be a jerk, but first step is to validate your code, with any luck that will solve the problem! http://validator.w3.org/check?uri=http%3A%2F%2Fwww.nowitnesses.org%2Fcharset=%28detect+automatically%29doctype=Inlinegroup=0 http://validator.w3.org/check?uri=http%3A%2F%2Fwww.nowitnesses.org%2Fcharset=%28detect+automatically%29doctype=Inlinegroup=0 Kevin On Thu, Jan 27, 2011 at 4:13 PM, Mark Collins msheek...@gmail.com mailto:msheek...@gmail.com wrote: I'm having trouble with my website, http://www.nowitnesses.org/. It comes up fine in every browser I've tested except IE7. Then it cuts off the page right after the overall_header template code in PHPBB3. Could someone look at it and tell me how I screwed it up? Thanks, Mark UN Issues Joint Statement on WikiLeaks http://www.cidh.oas.org/relatoria/showarticle.asp?artID=829lID=1 http://www.cidh.oas.org/relatoria/showarticle.asp?artID=829lID=1 - Inter-American Commission on Human Rights For every complicated problem there is a solution that is simple, direct, understandable, and wrong. - H. L. Mencken The Dunning–Kruger effect is a cognitive bias in which an unskilled person makes poor decisions and reaches erroneous conclusions, but their incompetence denies them the metacognitive ability to realize their mistakes. - Wikipedia Mark Collins, US2002045450 ADC Tech, Austin Camarilla: http://www.nowitnesses.org/ __ css-discuss [css-d@lists.css-discuss.org mailto:css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org http://evolt.org -- http://www.evolt.org/help_support_evolt/ -- For every complicated problem there is a solution that is simple, direct, understandable, and wrong. - H. L. Mencken The Dunning–Kruger effect is a cognitive bias in which an unskilled person makes poor decisions and reaches erroneous conclusions, but their incompetence denies them the metacognitive ability to realize their mistakes. - Wikipedia Mark Collins, US2002045450 ADC Tech, Austin Camarilla: http://www.nowitnesses.org/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Graphic background issue
Not quite:http://blogs.sitepoint.com/2007/09/18/png8-the-clear-winner/ PNG-8 have the possibility of multiple translucent palette entries, but only Fireworks has a PNG-8 export that supports this. Or use smush.it to convert down. In browsers that support PNG alpha you get the full translucency, and in IE7 you get that traditional GIF-like on/off transparency. I don't think this is off topic, as it would affect how you accomplish a CSS task, ie normally having a separate IE style sheet for transparent images. http://blogs.sitepoint.com/2007/09/18/png8-the-clear-winner/ Kevin On Mon, Jan 24, 2011 at 9:02 AM, G.Sørtun gunla...@c2i.net wrote: I'm thinking (accurately or not :) that an 8-bit PNG offers translucency (if that's the right word) if the original file has it. With a smaller file size than 24-bit. Right? Applicable? An 8-bit PNG is somewhat like a refined GIF - transparency is on/off. Example... http://www.gunlaug.no/contents/wd_additions_05.html ...and we are drifting off declared list-topic (CSS) now. regards Georg __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] A CSS calendar with an unordered list
IE 9 beta has IE7/8 rendering along with compatibility mode. I've used it a lot, though I've never done a side-by-side with the real browsers. Kevin __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] (no subject)
Post link. Could be 1 of many things: linking local files (that are on your computer but no one else's), invalid CSS or markup, different browser/version... Kevin On Sat, Jan 15, 2011 at 11:33 AM, amitabha ghosh amitabhaghosh...@gmail.com wrote: I have designed a page layout in css by using divs. but i am finding while opening in another browser computer it is breaking all the designs. can anybody help me to sort it out? -- amitabhaghosh __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] [Test]: Positioning an object element
Dang it, did it again - sent to individual and not the list. What's up with that?! Not sure if the W3 browser stats are accurate, but ignoring chrome (and or safari) seems to be ignoring a large % of potential users... 2010 Internet Explorerhttp://www.w3schools.com/browsers/browsers_explorer.asp Firefox http://www.w3schools.com/browsers/browsers_firefox.asp Chromehttp://www.w3schools.com/browsers/browsers_chrome.asp Safari http://www.w3schools.com/browsers/browsers_safari.asp Operahttp://www.w3schools.com/browsers/browsers_opera.aspDecember27.5 %43.5%22.4%3.8%2.2% Kevin Sent from Gmail in google chrome ;) On Wed, Jan 12, 2011 at 11:09 AM, Philip Taylor (Webmaster, Ret'd) p.tay...@rhul.ac.uk wrote: Gabriele Romanato wrote: Don't get me wrong but ... What is the percentage of use of Seamonkey? ;-) Philip, as a rule of thumb, you should always test in major league browsers, like IE, Firefox, Opera, Safari and Chrome. Of course, it /could/ be something to with the following, and nothing to do with my choice of browser at all : Validation Output: 5 Errors 1. Error Line 44, Column 37: Element object is missing one or more of the following attributes: data, type. object width=480 height=385param name=movie value= http://www.yout… 2. Error Line 44, Column 128: Stray end tag param. …nFl0nlHaWa4?fs=1amp;hl=en_US/paramparam name=allowFullScreen value=tr… 3. Error Line 44, Column 179: Stray end tag param. …allowFullScreen value=true/paramparam name=allowscriptaccess value=… 4. Error Line 44, Column 234: Stray end tag param. …n value=true/paramparam name=allowscriptaccess value=always/param 5. Error Line 45, Column 192: Stray end tag embed. …wscriptaccess=always allowfullscreen=true width=480 height=385/embed ** Phil. -- Not sent from my i-Pad, i-Phone, Blackberry, Blueberry, or any such similar poseurs' toy, none of which would I be seen dead with even if they came free with every packet of cornflakes. __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Right column drooping
Guess I should send this to the list, not just the individual...
rightcopy and leftcopy both need to be floated; either both left, or one
left and the other right. And get rid of the margin on rightcopy.
But then the container div wont clear. Two simple ways to accomplish this.
One way is to have a clearing div after right/left copy:
div class=clear/div (.clear { clear: both; } )
The other is to apply a clearing class to the container such as the one
from OOCSS:
.clear-fix{clear:both;display:block;visibility:hidden;overflow:hidden;height:0
!important;line-height:0;font-size:xx-large;content: x x x x x x x x x x x
x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x
x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x
x x x x x ;}
Kevin
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] HTML, CSS, JavaScript: Model-View-Controller
To be honest this 'discussion' on the merits of this post was a far greater waste of time than the post in question! :P Signal to noise ratio of this list tilts to the wrong side sometimes... Kevin On Wed, Jan 5, 2011 at 1:23 PM, David Laakso da...@chelseacreekstudio.comwrote: On 1/5/11 4:02 PM, Gabriele Romanato wrote: I'll stop it. From now on, no more posts from my blog. Well, no need to throw yourself through a closed window on the top floor of a tall building...:-) . Your on-topic posts to CSS-D are always informative and thought provoking. I do hope you will keep those coming... Best, ~quasimodo Paris -- http://chelseacreekstudio.com/ http://chelseacreekstudio.com/fa/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
