Re: [css-d] no ul list style with reset.css
On Sun, Nov 4, 2012 at 7:23 AM, Koen van der Drift
koenvanderdr...@gmail.com wrote:
Consider the following html5 and css code:
snip
body
article
ul class=test
lione/li
litwo/li
/ul
/article
/body
/html
main.css:
.test ul
{
list-style: disc;
}
By using the selector .test ul, you are mistakenly targeting the ul
child of some element styled with class test. But you want to target
the ul element that itself bears the class test, so the proper
selector is ul.test.
--
Regards,
Beth Lee
callibeth.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] @Fontface Not Working?
Am working on a coming soon page for my site and @font-face doesn't seem to be working. Not sure why .I implemented @font-face on another project and it was fine. Now it's not working for this. I am using a different font now - could this have something to do with it? I believe you need quotes around multi-word font family names -- both for the @font-face declaration and for the standard rule. Beth __ 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] Sticky Footer Cuts Off In FF 4 5 Both Mac Windows
On Sun, Sep 11, 2011 at 10:43 AM, David Laakso
da...@chelseacreekstudio.com wrote:
On 9/11/11 11:02 AM, Elli Vizcaino wrote:
Oops, forgot one thing.
To minimise the issue, you can give your footer a min-width, matching the
fixed
width of your main content.
#footer-wrapper { min-width: 1116px }
Yes, that helps and there was never any real problem other than that in Mac
OS X 10.4 FF/3.6.22. Unless, of course, the user is a deviant and has
minimum font-size set at 16px or greater in her browser prefs.
Not true. The problem was showing up in Vista FF/4.something-or-other,
and I'm no deviant. No special settings, anyway :)
The fix did indeed work, and not just for www.E7Flux.com, but also for
my site's wrapper and footer at www.callibeth.com. Hence my own
interest in the question.
Beth
__
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] Sticky Footer Cuts Off In FF 4 5 Both Mac Windows
Have you reproduced that on a real machine ? The problem seems to occur only if the page is opened in a browser window 1120px wide and then scrolled right. __ 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] Image going off page
On Thu, Aug 11, 2011 at 2:05 PM, Tindle, Terri terri.tin...@ago.mo.gov wrote: I took over a very complex website from a web designer. I'm trying to use her template to build a new page. The only issue is that in resolution 800 x 600, the main image goes off the page. To be honest, she is using at least 6 different css sheets and I don't even know where to start. Is it possible to build a custom class that takes care of this problem without having to sort through all the css? This site is supposed to go live within the next hr so I am a little in panic mode. A quick look show that it's fixed by removing the inline style on the image and then changing the div#tipTop text-align from right to center at line 168. I don't see that it changes anything else. Beth __ 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] Inaccessible block at some screen resolutions
Earlier, I've written at various times:
On this page:
http://www.callibeth.com/about.php
the bottom of the div gmain3 is covered up by the footer when the height
of
the browser windows is between 665px and 750px tall.
Within these
resolutions the gmain div is covered up by the footer and there is no
scroll bar to allow the user to access the bottom of the gmain div. At
larger and smaller heights this is not a problem.
On Vista, I see the problem in Chrome and Safari , but not in FF and Opera.
Even further clarification of the problem: Besides the inaccessible
content at a set range of browser window heights, the footer text was
repositioning around the gmain3 div as a float in that same range.
I got some help by consulting
http://www.cssstickyfooter.com/using-sticky-footer-code.html.
The first problem -- inaccessible block of text -- was solved by
increasing bottom padding on the gmain3 div's to equal the depth of
the footer. That's relatively easy to understand. No pun intended, but
I'll let it stand.
The second problem -- floating footer text -- was solved by adding the
class .clearfix to the gmain3 div and adding this clearfix hack to the
css code:
.clearfix:after {content: .;
display: block;
height: 0;
clear: both;
visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
I thought the clearfix hack was for browsers that are dead and/or
dying. Not so? It seems to fix the the clearing problem in my updated
webkit browers on Vista.
Beth
__
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] Inaccessible block at some screen resolutions
On Fri, Aug 5, 2011 at 12:03 AM, mouryan ekambaram
mouryan3...@gmail.com wrote:
If you have not solved the problem yet making following changes in
main.css file at line 621:
#gmain3 {
background-image: url(../site_images/backlt2.gif);
color: #FF;
float: left;
margin: 0 2em 2em;
padding: 12px;
width: 722px;
}
Eka
On Thu, Aug 4, 2011 at 10:48 PM, Beth Lee callib...@gmail.com wrote:
On this page:
http://www.callibeth.com/about.php
the bottom of the div gmain3 is covered up by the footer when the height of
the browser windows is between 305px and 750px tall.
Thanks for your reply.
Your suggestions do the following:
1. correct the syntax of the background-image selector. I wrote this
stuff when I was a real newbie (now I'm only a quasi-newbie), and it
turns out that I don't need the background-image line at all.
2. change the margin from [0 2em 0 2em] to [0 2em 2em 0]. This change
doesn't seem to affect the problem at all.
My original statement of the problem was slightly wrong. The issues
actually lies within the 665-775px browser-window height. Within these
resolutions the gmain div is covered up by the footer and there is no
scroll bar to allow the user to access the bottom of the gmain div. At
larger and smaller heights this is not a problem.
Beth
__
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] Inaccessible block at some screen resolutions
On this page: http://www.callibeth.com/about.php the bottom of the div gmain3 is covered up by the footer when the height of the browser windows is between 305px and 750px tall. It's been 4 years, and it's time to redesign, but I'm looking for a quick fix in the meantime. Can anybody suggest something? I rue the day I foolishly embraced the sticky footer. Regards, Beth Lee __ 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] browser check
On Fri, 11 Feb 2011, Matthew P. Johnson wrote: I am almost finished with our house site. Can you let me know if it displays correctly in your browser/os? ... http://applegateelements.com/ Is this how you want it to look? http://t.cfaj.ca/applegate.jpg Oh man what browser/os is this? It does not look right at all. On Windows Vista, looks fine in Chrome, IE8, Firefox, and Safari, as long as the window is large enough. But look at it in a 800x600 window. The header image reduces to fit, while the navigation bar causes a scroll bar, so that there is a gap to the right of the header image when you scroll right. Kind of strange looking, I think. I'd say that wasn't a problem, since so few people browse on their computers at 800x600. But given this behavior, I'm surprised that it looks fine on a Droid X -- the entire image and navigation magnify and reduce together. Regards, Beth Lee www.bethleedesign.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] spacing on right side
Matthew, you write:
I almost have this how I want it. I would like to not have the space to
the
right of each testimonial. Anyone know how to fix this?
http://ecoitsf.com/test/testimonials.shtml
blockquote {
color: #BBB;
color:#333;
font-size: .8em;
font-style:italic;
margin-top:0px;
margin-left:-5px;
line-height: 1.3em;
}
My Chrome browser is adding margin: 1em 40px; to your style sheet because
you haven't specified a right or bottom margin.
Add the following line to your blockquote statement:
margin-right: 12px;
Or just have one line for the margins:
margin: 0 12px 16px -5px;
(Why do you have 2 colors in your statement?)
Regards,
Beth Lee
www.bethleedesign.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] Help with IE6 and #*? Box Model
http://ohalah.org/wp/index.php Felix wrote: IE6 use is down to less than 5%, deprecated by M$ even. Yes, I wasn't going to worry about IE6, until I had a specific reason to do so. Philippe wrote: As far as I can see without checking in IE 6 ... the issue is not one of box model, but margin-doubling on floated blocks Your images have a left margin, IE 6 doubles that, and making a mess. The usual fix: Worked beautifully. Thanks so much! Georg wrote: While you're fixing IE6, note that you have serious typos in the IE6 stylesheet link in that page... Thanks for pointing that out. I dispensed with the extra stylesheet because the margin-doubling doesn't require one, but no wonder I was getting nowhere with that stylesheet. As I sent my post last night, I felt like the shoemaker setting out shoe leather and lasts for the elves, knowing that when I woke up this morning I would find my web page stitched together properly. Thank you all! Beth __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Help with IE6 and #*? Box Model
Hi all, I'm moving a site from tables into html5 and css, and onto WordPress. The head of the organization is concerned that the front page drops the 2 rows of 3 images out of alignment in her browser, which is ... AOL. Aargh. I've added a conditional statement to serve iecss.css to IE6, and I've tried a number of rules in it, but haven't managed a fix. The page is here: http://ohalah.org/wp/resources/member-sites The site is using the html5 doctype, which throws the page into quirks mode for IE6, yes? The page validates as html5. I could serve some other doctype to just the home page to avoid quirks mode, or deal with quirks mode. Any philosophy or wisdom on which approach is better? I kind of lean toward keeping the entire site as html5, since time is only marching forward. Regards, Beth Lee www.bethleedesign.com __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Help with IE6 and #*? Box Model
On Thu, Dec 16, 2010 at 10:34 PM, Beth Lee callib...@gmail.com wrote: Hi all, I'm moving a site from tables into html5 and css, and onto WordPress. The head of the organization is concerned that the front page drops the 2 rows of 3 images out of alignment in her browser, which is ... AOL. Aargh. Aargh again. The URL I gave was one of only 2 remaining tables on the site. I have other issues with those. I meant to reference this URL regarding the IE6 box model: http://ohalah.org/wp/index.php Beth __ 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] How to avoid quirks mode
On Sat, Nov 20, 2010 at 9:13 AM, Keith Purtell keithpurt...@keithpurtell.com wrote: I have a newbie question. I'm aware from discussion here that IE may run in quirks mode depending on how the html document is set up. But, it wasn't until viewing a css tutorial on lynda.com that I saw a specific way to prevent (most) IE quirks. Author Bill Weinman suggests the following code at the top of each html document. I've made the change throughout my site, but I want a second opinion about whether this is best practice. Thank you. (I noticed that after I made this change and opened ea page, Dreamweaver showed an alert that it had added a closing space and forward slash to many of my tags. Mostly in the head, but also with images and some code that embeds a Flash object for playing mp3 files. I'm curious as to why it did that.) !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd; ?xml version=1.0 encoding=utf-8? html xmlns=http://www.w3.org/1999/xhtml; I'm assuming from your post that you had no doctype declaration on your pages until you saw the css tutorial. Putting anything before the doctype declaration (!DOCTYPE ...) throws a web page into quirks mode. If you don't declare a doctype, your entire page comes before the doctype declaration, so you're likely to be serving HTML -- and your page is in quirks mode. HTML doesn't require that all tags be closed (e.g. pstuff here/p) or self-closing (e.g. img src=stuff here /), but XHTML does require it. So when you changed your doctype to XHTML by adding that specific doctype, DW fixed your page so that all opened tags are closed. There's more to know about IE8-and-below not supporting XHTML, but I haven't wrapped my head around that yet. Regards, Beth Lee www.bethleedesign.com __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] OK to insert block-level tag inside div?
On Thu, Nov 18, 2010 at 2:34 PM, John j...@coffeeonmars.com wrote: I now get that an ID must be used only once on a page. Within div tags (from code generously provided here) I've been able to format specific bits of content, like text, using classes and span tags. But I'd like to ad a dotted line between to paragraphs, and that seems to me to be a block-level tag required to do it. Is this correct? Can I throw in a br and apply a border-bottom to that or is that considered bad coding? A paragraph *is* a block-level element. Why not throw in some padding-bottom and apply a dotted border-bottom to that? You can add a class of 'last' to the last paragraph to override the border. Beth __ 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] Horizontal drop-down menu placement: FIXED!
Hi Steve, http://www.caramiadesign.com/md/ The page looks good on a wide screen, but, as David mentioned, your .container div (the one containing the nav) is pushing the page width out to the right -- by about 380+px past your design, hence the horizontal scroll bar. When I look at it in a 1024 x 768 window or smaller, the drop-down disappears out the right side of the window. Beth __ 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] Textarea not showing up
On Sun, Nov 7, 2010 at 9:58 AM, Rory Bernstein r...@rorykerber.com wrote: Hello. http://www.glitterlemonade.com/model_citizen/donate_occasion I have a textarea coded onto the form on this page, but it is not showing up. Your homepage_maincontent div is being taken out of the natural flow with the rule position: absolute. Change that to position: static (or just take it out altogether) to start fixing your layout. Regards, Beth Lee www.bethleedesign.com __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] problem: printable version of page
http://chmackellar.ehclients.com/printable_catalog I am making a print version of the above web page. If you go to this page and click print, then view a preview of the page, you will see that there is a ton of space right under the collection header, making most of the first page blank. Does anyone know why this is? I'd like the photos to start right under the collection header just as it does in the browser. I get various results with various browsers using an Epson WorkForce printer on Vista OS. Chrome -- no extra space below Collection. IE8 -- no extra space below Collection. Safari -- no extra space below Collection except that the space for the images, which are missing. Firefox -- rest of 1st page below Collection is blank; images being on page 2. HTH. Beth __ 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] Adjacent Sibling Selectors in Reverse?
On Mon, Aug 30, 2010 at 1:16 PM, Rick Gordon li...@rickgordon.com wrote: Yes, Tim, I understand that, and in fact, I am currently addressing the h2. The reason why I was trying to do it the other way is because the context is for EPUB formatting, and space above the h2 causes it to fall lower on the page if the h2 is at the top of a page. By addressing the p prior to the h2, I could adjust the margin-bottom of that, rather than the margin-top of the h2. Rick Gordon What giving the selector h2:first-of-type a smaller top margin than other h2 elements? Beth __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE Problem - logo appearing on top of text
--- On Tue, 31/8/10, Timariane Thornewig timandari...@yahoo.com wrote: I was wondering if someone can help me out, I'm a newbie. The logo is appearing on top of my text in several versions of IE. and then ... On Mon, Aug 30, 2010 at 7:24 PM, Timariane Thornewig timandari...@yahoo.com wrote: I just tried to adjust the CSS and I created another version of the HTML called: http://www.ashelighting.com/controldesign2.html Float your sidebar div left, and don't float your main div. That fixes it for me. __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Odd behavior of main div
On Sat, Aug 14, 2010 at 7:05 PM, William Gaffga will.gaf...@gmail.com wrote: Hi ... I'm working on a new portfolio site for myself and I've stumbled across something I just can't seem to figure out, namely, why the Main div on the page is shifting left by 8 pixels on 2 of my pages. This is the site: http://www.wilyguy.net/portfolio/index.html CSS is found here: http://www.wilyguy.net/portfolio/portfolio.css These are the offending pages: 1. http://www.wilyguy.net/portfolio/html.html 2. http://www.wilyguy.net/portfolio/images/grfx.php So ... the main div is being moved if some content is going beyond some boundary, as both cases have solutions by minimizing the content. This, again, makes no sense. If it extends below the viewport, the main content div shifts. That's the boundary. (On my MacBook, the Manuals also shifts also for this reason.) I don't see any reason it should be so, but it's a clue. As far as I can see, you have no width margins or padding on html, body, or main div, and your 1px borders shouldn't have any effect. Beth __ 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] Webkit problem with a list - I just can't figure it out
On Fri, Aug 13, 2010 at 9:36 PM, Nate pixeln...@gmail.com wrote: Hey guys, There is a problem with the way a nested unordered list in my sidebar is rendering. In Firefox everything is working fine (doesn't it always?), but in webkit browsers the first li renders properly while it's siblings are bumped to the right about 50px. I think your nested list items would render correctly if they were surrounded by ul/ul tags. Beth __ 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] ID vs. Class
-Original Message- From: css-d-boun...@lists.css-discuss.org [mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of Chris Blake Sent: Monday, July 19, 2010 8:50 PM To: css discuss discuss Subject: [css-d] ID vs. Class I understand the difference between class and ID to a basic level. ... - what's the real difference other than using it once or multiple times? 1. If you use an ID multiple times, your HTML won't validate. Maybe you don't care about that. 2. There is a difference between ID and class in the cascade in css. If a div has both a class and an ID, the ID rule trumps the class rule, since an ID has more specificity than a class, You can use the cascade to streamline your stylesheet. 3. If you use Javascript, your getElementById functions could go blooey if there are multiple divs with the same ID. (If there's a more technical terms for it, I don't know it.) Beth __ 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] ID vs. Class
Chris writes: 3. If you use Javascript, your getElementById functions could go blooey if there are multiple divs with the same ID. (If there's a more technical terms for it, I don't know it.) But it's OK if they classes? Well, you can't use getElementById (obviously), but you can use getElementsByClassName. Really for this because it is only appearing once for now I should use ID - but there's a good chance I may use it again later on this page - so class for now is OK? Sounds like class is the way to go. Beth __ 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] getting a horizontal list to float to the right
Do you need to set a width on the ul#nav? If you remove the rule
width:550px, it works as I believe you want it to.
Beth
On Fri, Feb 19, 2010 at 10:20 AM, Chris Kavinsky ckavin...@gmail.com wrote:
I'm working on a site with a horizontal navigation. Ideally, I would
like the list to float to the right side of the frame, but due to
applying float:left to the individual li items, I can't get it to work
properly. Am I doing something wrong, or is there a trick for this
without sieeting a specific width on the items?
Here's my css code for the nav:
ul#nav {
margin:0;
padding:0;
float:right;
text-align:right;
width:550px;
list-style:none;
}
#nav li {
margin:0;
padding:0;
font:italic normal 1.1em Georgia, Times New Roman, Times, serif;
display:block;
float:left; }
#nav li a {
color:#000;
text-decoration:none;
padding-left:15px;
text-align:right;
}
#nav li a:visited {
text-decoration:none;
color:#000;
}
#nav li a:hover {
text-decoration:none;
color:#be7734;
}
here's the live site for reference:
http://www.associationdatabase.com/aws/360/pt/sp/home_page
css file: http://209.235.212.107/screen.css
__
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] Amazing CSS
-Original Message- From: css-d-boun...@lists.css-discuss.org [mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of Charles Miller Sent: Tuesday, September 15, 2009 4:04 PM To: CSS-D CSS-D Subject: [css-d] Amazing CSS On Sep 15, 2009, at 2:53 PM, Shawn Lawler wrote: I think this what you're looking for mate: http://www.scottjehl.com/v7/index.php/process/html_text_drop_shadows The Matas text comes off to my eye with much more finesse. Don't think it's just white vs dark blue. The example on the Jehl site is too thick a shadow to appeal to me. I agree with the gist of Jehl's comment: The result is a hard-edged offset shadow that's not necessarily pretty, but it gets the job done. To me that suggests that the effect cannot be fine tuned. If I'm wrong, please let me know. Chuck M What about this? http://line25.com/tutorials/create-a-letterpress-effect-with-css-text-shadow I've been meaning to try it out, but haven't done so yet. Beth Lee http://www.bethleedesign.com/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] One Bullet Missing in IE
On 9/6/07, patrick mattison [EMAIL PROTECTED] wrote: I'm having a bit of a problem here. For some reason the red square bullet before About won't show up in IE, however the bullet for Career and Education shows up fine. Any suggestions? Below is the markup and the css: http://www.liquidscience.net/andrew/testercopy.html http://www.liquidscience.net/andrew/ag_style_1.css Specifically, it doesn't show up in IE 06 or IE 05.1, but it does show up in IE 07 on my Win/XP system. I'd like to see an answer to this one. I looked at this question when you first posted it, and can't see anything to cause the missing bullet. Beth __ 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] Website page needs css validation and cross-browser help
The page is here:
http://www.callibeth.com/galleries/gallery1/evelyn.php
The HTML validates, and the CSS validates except for two instances of this
rule:
* html div#__ {
overflow-x:hidden; /* hide horizontal overflow in IE5.x - 6 */
}
First, can I get a reminder hint as to why I have that hack? Second, if I
need my css to validate, can I serve it as a conditional comment; if so, how
do I do that?
I submitted it to browsershots.com and see a problem in IE across versions
and operating systems: the container or outer div -- can't tell which -- is
not presenting a scroll bar if the content doesn't fitabove the footer.
Although Firefox is not a problem, Safari 3.0.2 on XP is. How to fix?
Thanks,
Beth Lee
www.callibeth.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] Newbie CSS callibeth website questions
On 2/25/07, Gunlaug Sørtun [EMAIL PROTECTED] wrote:
Beth Lee wrote:
http://www.callibeth.com/dev2/index.htm
Myself: I tend to reduce support for older versions after a few years,
*when* there are at least a couple of later (and hopefully improved)
versions of that particular browser available.
IE/win users have IE6 and IE7 available now, so IE5/win gets only the
very minimum of my attention - if/when I have time for it.
Having written all that ... the following CSS addition will probably fix
IE5/win well enough for comfort, without disturbing later versions...
* html ol#navlinks li {margin-bottom: -.5em;}
Thanks, Georg. Finally, 1 page works across most browsers! Woo hoo. And,
more important, I'm finally getting the idea of how to approach the various
issues that crop up. I was beginning to think that would never happen.
__
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] Newbie CSS callibeth website questions
On 2/18/07, ~davidLaakso [EMAIL PROTECTED] wrote:
Beth Lee wrote:
This test site page is here: http://www.callibeth.com/dev2/index.htm
and the css is here: http://www.callibeth.com/dev2/css/main.css
In FF2, I'd like a little more room above the text in the quote div, but
if
I add even 1px of top padding, the quote div height expands from 47px to
58px, and space appears below the quote div. Something to do with #quote
and
p #indexintroquote, but in spite of looking around the Internet for
possible
answers, I'm clueless.
[Many other questions trimmed]
With regard only to the quote issue:
There is (I think) a collapsing margin [1] issue at work as well-- it
is easier to see in Opera/9.02. You may do better by deleting the
height. Adding a 1px padding-bottom for the margin problem. And zeroing
out the padding, and margin on the font (except for the padding-top). A
ie height correction hack is for ver 6 and down:
div#quote {
/*min-height: 47px; */ delete
padding-bottom: 1px; add for margin-collapsing*/
}
#indexintroquote {
margin-top: 0; margin-bottom: 0; padding-top: 7px; padding-bottom: 0;
add these
}
hack for ie/6.0 and down
* html div#quote {
height: 0;
}
[1] http://www.w3.org/TR/CSS21/box.html#collapsing-margins
PS I think you need a more suitable doctype.
Thanks for the reply. It works beautifully. I wish I knew why. I looked at
margin-collapsing, but I couldn't figure which margins could be collapsing.
I thought the applicable divs all had 0 top and bottom margins.
What would be a more suitable doctype? A link to a good explanation would be
helpful. (This is a web certification project, and the course instructs us
to use this doctype, so I'm not sure I can change it on this website, but
I'd like to know the pros and cons for the future, or maybe for arguing with
the instructors :) .)
Beth
__
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] Newbie CSS callibeth website questions
Hi, I'm still working on my first CSS website, and struggling with some very simple CSS problems on a very simple web page ... I think. This test site page is here: http://www.callibeth.com/dev2/index.htm and the css is here: http://www.callibeth.com/dev2/css/main.css In FF2, I'd like a little more room above the text in the quote div, but if I add even 1px of top padding, the quote div height expands from 47px to 58px, and space appears below the quote div. Something to do with #quote and p #indexintroquote, but in spite of looking around the Internet for possible answers, I'm clueless. In all IE browsers, the space between the background image at the top and the #bethleesub text is a good deal greater than that in FF2. Is there a way to make that space more regular across the browsers, or is this the normal sort of difference we just put up with? And the footer doesn't quite stick to the bottom of the viewport in any version if IE. In IE6, there's space between the #quote div and the navigation bar that isn't there in FF2 and IE7. Why, or, at least, how to fix? In IE5, there are 3 problems: 1. There's no light-blue background in the #quote div even though I thought I specified one. Is that something I just lose? If there *was* a light-blue background I'd probably be having the IE6 problem mentioned above. 2. Any ideas about what to do about the navigation bar that is not styled very happily in this browser? 3. The three main boxes are not centered. Don't know why. What's the best way to address that? And help with these problems, or any other problems I don't see yet, would be much appreciated. Regards, Beth Lee callibeth.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/
