Re: [css-d] Advertisement has unwanted link border around it
Does giving #sideNavBar li a { } a rule of border:none help? Text-
decoration has nothing to do with a border.
Theresa
On Nov 7, 2009, at 3:29 PM, Brian M. Curran wrote:
Hi,
In IE7 and Firefox the advertisement on my site
http://www.locallaw11of1998.com/
has an unwanted border around it, because it is a link. The ad is a
CSS list as the code below shows. I tried a few ways of giving it
text-decoration: none; but that didn't work. Does anyone know how to
get rid of the border?
#sideNavBar {
padding: 0 10px;
margin: 0;
width: 140px;
}
#sideNavBar li {
list-style: none;
margin: 0;
padding: 2px 0;
}
#sideNavBar li a {
display: block;
}
#sideNavBar li img {
vertical-align: bottom;
}
The home page HTML is:
div id=contentIndex3
h2Ads/h2
hr/
ul id=sideNavBar
li id=t-ad1a href=http://www.brianmcurran.com;
target=_blankimg src=images/BrianMCurranAd.gif width=120
height=90 alt=BrianMCurranAd //a/li
/ul
/div
Thanks,
Brian
__
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/
[css-d] floats with margins
Hello all, I have a div container which has many floated images inside of it. The images have 10px bottom and right margins, so they can space out and look good. I noticed when I put a background color on the container that it contains the all the images, yay which brings me to my question... I also though noticed the bottom margins of the floated images affected the container, so it has 10px of space at the bottom. i dont want this. I assumed the margins would 'pop out' since i've seen that before (when the container or sibling div's don't contain padding/borders, i think it should do this default so margins 'collapse' ... But not sure for floats, they may not affect in same way). Anyway is there a way to stop the images margin from affecting parent? Thanks!, Ari __ 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] What defines a ture holy grail layout?
Jay Tanna wrote: let lassko have a look at it. If he doesn't swear at you it must be fine ;) So is Lassko our resident expert on all things CSS here? Laakso is the American page shredder. The European mafia, Sørtun, Wittenbergh, Fassino and Chao are quite good also. Then there is myself, the crazy from Down Under. There are also many others notables. It is useful to know so that we can fire quick questions towards him to his direct email. It is best to direct the question to the list. This is since as a community we can all learn and also, we have our individual strengths and weaknesses in our knowledge of or understanding of CSS. Another good reason is that those in the CSS Working Group and Browser Implementors also follow this list. Either noting bugs in browsers or how people abuse CSS and make their job harder. The Holy Grail layout (or one true layout) causes implementors to have to check these layouts with each version or build to see if they will destroy many web pages in one foul swoop. http://dbaron.org/log/2005-12#d20051228 I am in the middle ground on this issue. -- Alan http://css-class.com/ Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo __ 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] Vertical padding weirdness
G. Sørtun skrev: Benct Philip Jonsson wrote: So that's the margins of the h1 and the p interfering? Outside the boxes of the divs which contain them? I *really* don't understand how margins are calculated! You're encountering collapsing margins... http://www.w3.org/TR/CSS21/box.html#collapsing-margins ...and in your case it's easier to think about them as escaping vertical margins. The vertical margins on elements do indeed escape containers, but will stop escaping inside the first containing-box that has vertical paddings set on it - one of the W3C-standardized contain vertical margins solutions available to us. Which contain vertical margins solution that works best will always depend on the actual case, but vertical paddings on the innermost containing-box will always do the job. Will setting any small amount of padding on the innermost containing box do the trick, like 1px or even 0px as opposed to not declaring any padding at all? /BP Keep the above W3C link handy, study what it says, but don't worry too much about not understanding exactly how collapsing margins works in its minutest details. Those who write standards and build browsers have had their fair share of failures in writing and programming in and out around those collapsing margins over the years, and you may still run into some unclear and inconsistent cases in both camps. regards Georg __ 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] Vertical padding weirdness
Benct Philip Jonsson wrote: Will setting any small amount of padding on the innermost containing box do the trick, like 1px or even 0px as opposed to not declaring any padding at all? Has to result in a real vertical padding - minimum 1px - to work reliable, so 0px, or a value so small that it results in zero padding when various browsers calculate it, won't work. regards Georg __ 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] floats with margins
Ari Army wrote: Hello all, I have a div container which has many floated images inside of it. The images have 10px bottom and right margins, so they can space out and look good. I noticed when I put a background color on the container that it contains the all the images, yay which brings me to my question... I also though noticed the bottom margins of the floated images affected the container, so it has 10px of space at the bottom. i dont want this. I assumed the margins would 'pop out' since i've seen that before (when the container or sibling div's don't contain padding/borders, i think it should do this default so margins 'collapse' ... But not sure for floats, they may not affect in same way). Anyway is there a way to stop the images margin from affecting parent? Thanks!, Ari Hello Ari, please see. http://www.w3.org/TR/CSS21/box.html#collapsing-margins Two point from the part on vertical margins collapsing. Vertical margins between a floated box and any other box do not collapse (not even between a float and its in-flow children). Vertical margins of elements that establish new block formatting contexts (such as floats and elements with 'overflow' other than 'visible') do not collapse with their in-flow children. Would the container happen to have a property that has established a block formatting contexts? http://www.w3.org/TR/CSS21/visuren.html#block-formatting To remove the 10px gap under the images, remove the margin:bottom. -- Alan http://css-class.com/ Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo __ 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] floats with margins
You could create a class for the images on the bottom row img class=last
and change the padding on the bottom to img.last {padding-bottom: 0;}
The last row though may be populated by any number of images, as the site is
a dynamic CMS like Drupal, so if the thumbnail size changes (if the user
uploads a pic that is landscape alongside portrait pics, the pic is resized
to a height 100px so looks clean, but can't set a last row for this reason).
I could loop through the pics and put pretend 3 pics per row if the width
was the same, but then the rows don't look as neat as height-wise thumbnails
in my opinion.
To remove the 10px gap under the images, remove the margin:bottom.
Still want the images to be spaced out nice though, I'll try to think up
something. Doesn't look bad, friend just need would like the border-left on
the container to line up with the bottom of the images if possible, like
noticed how border sticks out of bottom here:
http://arianhojat.com/temp/float-bottom-margin.jpg
thanks!,
Ari
__
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] Site check please
Hi Theresa, Thank you for the email, the LOGO.jpg is not uploaded that is why it is not showing. I do have an issue on IE though at the moment, the text string: Header2 and the text below is not showing within the confines of the grey background image. How can I make sure that this shows in the right place? Thank-you very much, Kind Regards, Ed - Original Message - From: Theresa Mesa trixiesirishe...@gmail.com To: Norman Fournier nor...@normanfournier.com Cc: CSS Discuss css-d@lists.css-discuss.org Sent: Saturday, November 07, 2009 8:20 PM Subject: Re: [css-d] Site check please Well, according to your source code, there's supposed to be a logo there, called LOGO.jpg. Doesn't look like the image is on the server. Did you upload the images folder to the server? Is the logo in the images folder? Theresa On Nov 5, 2009, at 3:01 PM, Norman Fournier wrote: Safari 4.0.3 shows me an image missing icon in the upper left and corner. On 4-Nov-09, at 4:46 PM, Theresa Mesa wrote: What kind of things are you looking for us to find? On Nov 4, 2009, at 3:16 PM, Ed Goodson wrote: Hi all, Please could someone kindly test this on IE- especially 6. It looks fine to me on ff The page is tentatively passed xhtml strict. http://www.copywritecolombia.com/test.html Thank-you very much, Cheers, Ed __ 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] Site check please
- Original Message - From: Theresa Mesa trixiesirishe...@gmail.com To: Norman Fournier nor...@normanfournier.com Cc: CSS Discuss css-d@lists.css-discuss.org Sent: Saturday, November 07, 2009 8:20 PM Subject: Re: [css-d] Site check please Well, according to your source code, there's supposed to be a logo there, called LOGO.jpg. Doesn't look like the image is on the server. Did you upload the images folder to the server? Is the logo in the images folder? Theresa On Nov 5, 2009, at 3:01 PM, Norman Fournier wrote: Safari 4.0.3 shows me an image missing icon in the upper left and corner. On 4-Nov-09, at 4:46 PM, Theresa Mesa wrote: What kind of things are you looking for us to find? On Nov 4, 2009, at 3:16 PM, Ed Goodson wrote: Hi all, Please could someone kindly test this on IE- especially 6. It looks fine to me on ff The page is tentatively passed xhtml strict. http://www.copywritecolombia.com/test.html Thank-you very much, Cheers, Ed __ 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/ Hi Theresa, Thank you for the email, the LOGO.jpg is not uploaded that is why it is not showing. I do have an issue on IE though at the moment, the text string: Header2 and the text below is not showing within the confines of the grey background image. How can I make sure that this shows in the right place? Thank-you very much, Kind Regards, Ed http://www.copywritecolombia.com/test.html __ 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] Site check please
That's why Safari is giving you the missing image icon. The image your code is calling is missing, because it's not on the server. ;-) Which version of IE are you having the header issue with? To be honest, my attempts at making stuff work on IE are all hail Mary passes, but I'm learning. I'm thankful IE7 and 8 pretty much behave. OTOH, first of all, your site is XHTML Transitional. You should get out of the habit of doing your tags (in your CSS) in caps. I'm thinking your problem would be with how IE handles the box model, especially earlier versions of IE. Someone more studied than me is going to need to figure it out. All I know is the things look really tight in there looking at it through the FF Web Developer toolbar CSS menu (View Styles), and your h2 and p edges are so wide, they're going under your red box. IE may not be handling it the way you want it to. I'm reposting the link to your site here so others can maybe help. http://www.copywritecolombia.com/test.html Theresa On Nov 8, 2009, at 4:21 PM, Ed Goodson wrote: Hi Theresa, Thank you for the email, the LOGO.jpg is not uploaded that is why it is not showing. I do have an issue on IE though at the moment, the text string: Header2 and the text below is not showing within the confines of the grey background image. How can I make sure that this shows in the right place? Thank-you very much, Kind Regards, Ed - Original Message - From: Theresa Mesa trixiesirishe...@gmail.com To: Norman Fournier nor...@normanfournier.com Cc: CSS Discuss css-d@lists.css-discuss.org Sent: Saturday, November 07, 2009 8:20 PM Subject: Re: [css-d] Site check please Well, according to your source code, there's supposed to be a logo there, called LOGO.jpg. Doesn't look like the image is on the server. Did you upload the images folder to the server? Is the logo in the images folder? Theresa __ 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] Site check please
Ed Goodson wrote:
http://www.copywritecolombia.com/test.html
I do have an issue on IE though at the moment, the text string: Header2 and
the text below is not showing within the confines of the grey background
image. How can I make sure that this shows in the right place? Thank-you
very much, Kind Regards, Ed
http://www.copywritecolombia.com/test.html
I assume the issue are talking about is in XP IE/6.0 and IE/7.0, and
that the specific issue in those two IE browsers is the slightly larger
horizontal gutter under h2 and the list beneath it. And that IE/8.0 is
rendering it as you intend.
If so, #navlist is your target selector and this change brings IE/6.0
and IE/7.0 on-board:
#navlist
{
margin-left: 0; :: delete ::
margin:0;-- :: add ::
padding-left: 0;
list-style: none;
}
~d
__
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] The holy grail
The holy grail is that place we'll all be to (soon, I think) when we can finally stop worrying, thinking about and dealing with IEsicks. -- /* Colin (Sandy) Pittendrigh --oO0 */ __ 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 overriding a list style
Hello, I need help:
I have this css in an external file:
.box_inner ul li {
list-style-image: url(images/bullet-teal.gif);
margin-left: 3em;
}
I only want this to apply to one list that has external links. How
can I override this css for my non-link lists? The lists are all
attached to boxes. Here is the page with the external link lists; the
other lists that I want to have no style-type-image are on other
pages, but are coded exactly the same as the feedback page, except the
feedback page has lists that are links. I only want the links to have
bullets.
http://198.189.180.32/ma-ftp/media-arts/DMA_C111/dery/site/feedback_6.html
http://198.189.180.32/ma-ftp/media-arts/DMA_C111/dery/site/main.css
Thanks
Kathleen
__
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 overriding a list style
You could remove bullets on lists with a general rule: li {
list-style-type: none; }
Then you could assign a bullet class to the list you want: .bullet li
{ list-style-image: url(images/bullet-teal.gif); }
Russ
- Original Message -
From: Kathleen R Dery krd...@gmail.com
To: css-d@lists.css-discuss.org
Cc: Kathleen R Dery krd...@gmail.com
Sent: Sunday, November 08, 2009 8:58 PM
Subject: [css-d] help with overriding a list style
Hello, I need help:
I have this css in an external file:
.box_inner ul li {
list-style-image: url(images/bullet-teal.gif);
margin-left: 3em;
}
I only want this to apply to one list that has external links. How
can I override this css for my non-link lists? The lists are all
attached to boxes. Here is the page with the external link lists; the
other lists that I want to have no style-type-image are on other
pages, but are coded exactly the same as the feedback page, except the
feedback page has lists that are links. I only want the links to have
bullets.
http://198.189.180.32/ma-ftp/media-arts/DMA_C111/dery/site/feedback_6.html
http://198.189.180.32/ma-ftp/media-arts/DMA_C111/dery/site/main.css
Thanks
Kathleen
__
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/
