Re: [css-d] Min-height, height, and viewport size
Zoe, Audra, Thank you for your responses. I now have a clearer understanding of how elements inherit height from each other. It seems that if there is a way to do this, it will involve some very clever manipulations of div tags. More than I can figure out right now, so I've opted to go with Audra's suggestion of a simple solid red coloured border for now. It will suffice until inspiration hits and I can pull off something fancier. -- Dave M G CSSed Zend Studio 5.5 Photoshop 7 (Wine) Inkscape, GIMP, Ubuntu 7.04 __ 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] Variable width of menu
CSS-d, This is something that I thought was fairly simple, but I can't for the life of me determine how to do it. On the following page, I have a menu that is made up of li elements in a vertical flow. http://nihongode.jp The vertical flow of text was acheived by cheating a little. Each li is only 1em wide, forcing each character to appear below the one before. All I want to achieve is to have the menu be only as wide and high as it takes to fit the menu items. The height is working fine. I established a min-height of about 160px. Any less than that and the image of the sumo-cherub gets clipped. If there's more text in any one menu item, then the bottom border gets pushed down, with a 7px padding. But the width is nowhere near as easy. Setting a minimum width makes the menu expand across almost the entire page. Setting a fixed width doesn't have any connection to the number of menu items, so it won't expand or contract to contain them. I tried setting the width to an size based on em, hoping that would cause it to expand proportionally if the text size was adjusted up or down. But, although it does scale with the text, it doesn't do in the right proportions, causing the text to move out of alignment with the graphic. I have a feeling I've missed something similar. How can I have the yellow box of the menu match the width of the textual menu inside, as determined by the number and size of the menu items? Thank you for any advice. -- Dave M G CSSed Zend Studio 5.5 Photoshop 7 (Wine) Inkscape, GIMP, Ubuntu 7.04 __ 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] Z-index not rising to the top
CSS-d, I have a DIV that is floated right, and contains a graphic and a menu. The web site is here, and the menu is the one on the right hand side, being carried by a sumo-cherub: http://nihongode.jp Depending on the browser width, there is a chance it can overlap with the main logo graphic. By default, it seems to go underneath the logo. So, I set the div to have a z-index of 1000. The div that contains the logo has a z-index of 100. However, this has not made the div rise to the top. It still gets obscured by a portion of the logo if it happens to be located in a space occupied in part by the logo. Am I missing something fundamental about how Z-index works? Thank you for any advice. -- Dave M G CSSed Zend Studio 5.5 Photoshop 7 (Wine) Inkscape, GIMP, Ubuntu 7.04 __ 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] Z-index not rising to the top
On Jun 8, 2007, at 4:28 PM, Dave M G wrote:
I have a DIV that is floated right, and contains a graphic and a menu.
The web site is here, and the menu is the one on the right hand side,
being carried by a sumo-cherub:
http://nihongode.jp
Depending on the browser width, there is a chance it can overlap with
the main logo graphic.
By default, it seems to go underneath the logo. So, I set the div to
have a z-index of 1000. The div that contains the logo has a z-
index of 100.
However, this has not made the div rise to the top. It still gets
obscured by a portion of the logo if it happens to be located in a
space
occupied in part by the logo.
Am I missing something fundamental about how Z-index works?
Read:
http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index
z-index only applies to positioned elements.
#verticalMenu {position relative;/* rest of styles*/} will fix that
Philippe
---
Philippe Wittenbergh
http://emps.l-c-n.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Menu ID Ignoring containing Div class width.
Hello, Having some problems here: http://www.linkhomes2000.co.uk/trials/tryagain-index-3.php Firstly must state I have div class=nav id=nav4 now both of these contain elements with position:absolute. the class places the div in and absolute position, while the id places the liul in position:absolute. But he id seems to be totally impervious to the class, it just ignores it? I set width:75% on class then width 100% in id should place the id in it's correct position, but in fact it just extends to 100% 0f the screen, ignoring the fact it has an containing div? Also, if I try and insert more than four buttons in FF2 or three in IE6 (both pc) they fall out of the bottom. If I use clear, then menu becomes vertical instead of horizontal. if I use display inline or (inline-block for IE) makes no difference, don't understand what the menu id is doing and why it ignores it's containing div? Any help gratefully appreciated.. Still haven't (as yet corrected html failure points on validator report, but these not causing current error, as said passed css validator) Regards David G) __ 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] pleeeeease help.....png problems
The thing I noticed and am not sure if it is the problem, but your
style for:
.index #content #header img.logo { behavior: url(iepngfix.htc) }
doesn't have a semi-colon at the end. I'm relatively new to css but I
have yet to see anyone not close with the semi-colon.
When I've used the iepngfix.htc, I've never needed to go into
my .htaccess file. The difficulty in implementing it was always
getting the paths right, uploading the blank.gif into the correct
directory/ies. I often need to put the blank.gif in a lot more places
than the instructions tell me to, because of my file structure. It
also doesn't hurt to just put the behavior on all images, as it will
only work on the png files.
My sample css for an iepngfix:
img { behavior: url(../functions/iepngfix.htc); }
jen
__
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] unwanted padding-top padding-bottom
Joanne wrote:
p {
font-size: 100%;
margin-top:0;margin-bottom:0; --- kill the top and bottom margin
font-family: Verdana, Helvetica, Arial, sans-serif;}
---
Like the last suggestion, this is going to remove the margins from my
paragraphs. I don't want to remove the margins from my paragraphs. I want to
remove the large white gap on the top bottom of the #content div. I still
need the paragraphs to look like paragraphs inside the #content div. When I
have a h1 as the first thing in my #content div, there's no gap at the
top.
Is there so simple solution to this? If not, I'll have to change the layout
to suit.
Joanne
There probably is a simple solution, and I am blocking on it. Perhaps
someone else can assist.
I suppose to separate the paragraphs, you could add:
padding: 10px 0; to the above selector.
But I guess it depends on what you are trying to do and why you are
trying to do it. And if it is client driven. Or the attempt to reproduce
a table-based layout.
I'd be more prone to consider a much simpler layout and more
contemporary look without using any images at all-- that, of course, is
a purely personal opinion (and I have no client with a gun to my head).
Best,
~dL
--
http://chelseacreekstudio.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] unwanted padding-top padding-bottom
Joanne,
On Jun 8, 2007, at 7:56 AM, David Laakso wrote:
Joanne wrote:
p {
font-size: 100%;
margin-top:0;margin-bottom:0; --- kill the top and bottom margin
font-family: Verdana, Helvetica, Arial, sans-serif;}
---
Like the last suggestion, this is going to remove the margins from my
paragraphs. I don't want to remove the margins from my paragraphs.
I want to
remove the large white gap on the top bottom of the #content
div. I still
need the paragraphs to look like paragraphs inside the #content
div. When I
have a h1 as the first thing in my #content div, there's no gap
at the
top.
Is there so simple solution to this? If not, I'll have to change
the layout
to suit.
Joanne
There probably is a simple solution, and I am blocking on it. Perhaps
someone else can assist.
You want to keep the paragraphs margins from escaping their container
div. To do that you must prevent them from 'touching' the div
margins. Interposing a tiny bit of padding (or border) can do that.
#content { padding-top: 1px; padding-bottom: 1px; }
Roger,
--
Roger Roelofs
[EMAIL PROTECTED]
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Using a:hover to show an image
Hi all,
My client wants to have a thumbnail image shown on the page that gets
bigger when hovered over. I adapted the hoverbox method that I found
here: http://solardreamstudios.com/_img/learn/css/pg/ and it looks
fine in Safari. However in both IE7 and FF (Mac and Windows) the big
image loads in a different place (about 50px to the right) and
flickers on and off rapidly.
Could someone have a look at this page and suggest what I am doing
wrong?
http://www.tellura.co.uk/fenditching/page4/case_studies.htm
Here is what I did:
In the css:
.hoverpic_reed_fen_farm a img{
border: 0 none;
position: absolute;
width: 35px;
height: 49px;
}
.hoverpic_reed_fen_farm a:hover img, .hoverpic_reed_fen_farm a:active
img, .hoverpic_reed_fen_farm a:focus img {
width: 300px;
height: 424px;
left: 350px;
top: 200px;
z-index: 1;
background-color: #ff;
padding: 5px;
border: 1px solid #00;
}
In the html:
div class=hoverpic_reed_fen_farm
a href=assets/Reed%20Fen%20Farm%20Case%20Study.pdf
target=newimg src=assets/reed_fen_farm.png/a
/div
h4The Fen Ditching Company provide environmentally-friendly
solution to helpbr /rural Cambridgeshire farm solve Summer
irrigation problembr /
a href=assets/Reed%20Fen%20Farm%20Case%20Study.pdf
target=newdownload case study (PDF)/a
/h4
Ian.
__
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] Menu ID Ignoring containing Div class width.
[EMAIL PROTECTED] wrote:
Hello,
Having some problems here:
http://www.linkhomes2000.co.uk/trials/tryagain-index-3.php
Firstly must state I have div class=nav id=nav4 now both of these
contain elements with position:absolute.
the class places the div in and absolute position, while the id places the
liul in position:absolute.
But he id seems to be totally impervious to the class, it just ignores it?
I set width:75% on class then width 100% in id should place the id in it's
correct position, but in fact it just extends to 100% 0f the screen,
ignoring the fact it has an containing div?
I'm not *exactly* sure what you're going for, but you have width 75% on
your .nav in main-2.css then you have this is menus.css:
#nav4, #nav4 ul { /* all lists */
width:75%;
padding: 0;
margin: 0;
list-style: none;
background-color:#00;
word-spacing:normal;
letter-spacing:normal;
}
If you delete the width here your menu will go all the way to the right
side in FF2 IE6 if that's what you want...
Your class and id are being obeyed according to what you've written as
far as I can tell.
AC
--
Audra Coldiron
Rock-n-Roll Design Hosting
http://rock-n-roll-design.com
KarmaCMS ( http://karmawizard.com ) - the ultimate CSS styled CMS.
Pre-made designs, designer tools, and reseller program available!
__
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] Using a:hover to show an image
On Jun 8, 2007, at 8:23 AM, Ian Piper wrote:
http://www.tellura.co.uk/fenditching/page4/case_studies.htm
Basically, the hovered (large) image is positioned relative to the
browser-window, while it should be positioned relative to the element
holding the link. It is essential, for the effect you're after, that the
hovered (large) image is in the link-position, or else it'll lose focus
when hovered.
Add...
.hoverpic_reed_fen_farm {position: relative;}
...to establish the relation.
Correct position to something like...
.hoverpic_reed_fen_farm a:hover img, .hoverpic_reed_fen_farm a:active
img, .hoverpic_reed_fen_farm a:focus img {left: -10px; top: -70px;}
...to keep it in correct place when hovered.
regards
Georg
__
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] What, o what am I doing?
Hello all, I posted a few days ago but took the page down due to an unrelated event. Sorry if anyone stumbled down that dead link. Incidentally, I was able to resolve most of the issues from that post, anyhow. There are these two new(ish) issues that I can't figure out for the life of me. The xhtml and css are valid are here: http://www.lccoachingbeta.com/web/LCC/countryprofiles1fix.html http://www.lccoachingbeta.com/web/LCC/css/lcctestfix.css 1. The p.normal tags aren't floating to the right of the thumbnails in FF2 the way I'd imagined they would the way that they do in IE6+7. Any suggestions on how I could fix this would be massively appreciated. 2. In IE6 the #nav column intermittently disappears when flash javascript are disabled. The trend has been that the page will load with the column visible, which then disappears on refresh. Enabling flash causes the column to reappear and keep it there. Any ideas on how I can make the alternate-content #nav column stable? It's intermittent that's what gets me... I'm baffled. I'd love to hear any suggestions you'd like to throw at me. __ 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] Safari problem?
I'm working on a site at http://208.76.80.155/~czcejymt, and it looks fine in all the browsers I have installed (IE7 and Firefox Win, Firefox and Camino OS X) except for Safari. On the two longer pages (Work and Customers) Safari seems to be dropping div#bottom way, way down on the page. It seems fine on the shorter pages however. I am using a script to force equal column lengths (http://208.76.80.155/ ~czcejymt/js/equalcolumns.js), but I don't know whether that's the culprit or not. Could someone also let me how the site looks in IE6 Win? Thanks so much. --- Suzanne Goodwin Sky Dog Technologies 1072B Massachusetts Avenue Arlington, MA 02476 __ 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] Z-index not rising to the top [SOLVED]
Philippe, Thank you for responding. z-index only applies to positioned elements. Doh! I remember learning that only a couple months ago. Apparently I have the memory span of a gold fish. Thank you for setting me straight again. -- Dave M G CSSed Zend Studio 5.5 Photoshop 7 (Wine) Inkscape, GIMP, Ubuntu 7.04 __ 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] Opera 9 display bug?
I have a page which displays fine in FF and IE, but in Opera 9 the border around the comment field is missing (see lower right of page): http://www.kdwebstudio.com/contact.html style sheet: http://www.kdwebstudio.com/styles-GREEN.css (Note: this is only a 4.01 transitional draft page and the css validation errors don't seem to relate to this problem, but I could be wrong.) TIA for any ideas! __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Variable width of menu
On Jun 8, 2007, at 4:19 PM, Dave M G wrote: On the following page, I have a menu that is made up of li elements in a vertical flow. http://nihongode.jp The vertical flow of text was acheived by cheating a little. Each li is only 1em wide, forcing each character to appear below the one before. All I want to achieve is to have the menu be only as wide and high as it takes to fit the menu items. [...] But the width is nowhere near as easy. Setting a minimum width makes the menu expand across almost the entire page. Setting a fixed width doesn't have any connection to the number of menu items, so it won't expand or contract to contain them. I tried setting the width to an size based on em, hoping that would cause it to expand proportionally if the text size was adjusted up or down. But, although it does scale with the text, it doesn't do in the right proportions, causing the text to move out of alignment with the graphic. I have a feeling I've missed something similar. How can I have the yellow box of the menu match the width of the textual menu inside, as determined by the number and size of the menu items? 1. you work from different em values. An em-width on the div is different than a em-width on the li. 2. mixing pixels and ems is complicating things. 3. you make the ul partly empty by using a negative left-margin a. I set the font-size on the div (#verticalMenu), and set the ul and the li to inherit that. b. I removed the width on the div (aka width:auto), it is a floated div, it should shrink-wrap to the content. c. I gave the ul a padding-left equal to the negative margin-left, making sure that the box for the ul has the required computed width to keep the div open. d. enjoy. or not, as it breaks in Firefox 2.0.0.x, and that is a bug (it works correctly in Gecko nightly builds) [1]. Safari/Webkit, Konqueror and Opera 9 are happy though. so. b1. add a width back to the div. 7.5em seems to work fine. Adjust to taste. Safari/Webkit, Konqueror and Opera 9 are still happy. IE 6 7 might be more happy. Not tested. [1] second row of the Acid2 test if you want all the details. Philippe --- Philippe Wittenbergh http://emps.l-c-n.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] Opera 9 display bug?
I listed the wrong style sheet, it's http://www.kdwebstudio.com/styles2.css sorry! Quoting [EMAIL PROTECTED]: I have a page which displays fine in FF and IE, but in Opera 9 the border around the comment field is missing (see lower right of page): http://www.kdwebstudio.com/contact.html style sheet: http://www.kdwebstudio.com/styles-GREEN.css (Note: this is only a 4.01 transitional draft page and the css validation errors don't seem to relate to this problem, but I could be wrong.) TIA for any ideas! __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-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] Using a:hover to show an image
Excellent, thanks. That was where I was going wrong.
Regards,
Ian.
On 8 Jun 2007, at 2:22 pm, ron zisman wrote:
On Jun 8, 2007, at 8:23 AM, Ian Piper wrote:
http://www.tellura.co.uk/fenditching/page4/case_studies.htm
Basically, the hovered (large) image is positioned relative to the
browser-window, while it should be positioned relative to the element
holding the link. It is essential, for the effect you're after,
that the
hovered (large) image is in the link-position, or else it'll lose
focus
when hovered.
Add...
.hoverpic_reed_fen_farm {position: relative;}
...to establish the relation.
Correct position to something like...
.hoverpic_reed_fen_farm a:hover img, .hoverpic_reed_fen_farm a:active
img, .hoverpic_reed_fen_farm a:focus img {left: -10px; top: -70px;}
...to keep it in correct place when hovered.
regards
Georg
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] suckerfish not accessable with safari
Thanks, you where right. Now everything is as expected.
Jörn
-Ursprüngliche Nachricht-
Von: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] Im Auftrag von Ingo Chao
Gesendet: Donnerstag, 7. Juni 2007 14:22
An: Jörn Kretzschmar
Cc: css-d@lists.css-discuss.org
Betreff: Re: [css-d] suckerfish not accessable with safari
Jörn Kretzschmar wrote:
...
I just can’t find a way to change my CSS so it display without errors in
Safari (mac). The top navigation is ok but if a menu drops down OVER content
you just can’t click an the link. With Internet Explorer and Firefox the
content is in the back and all links are ‚clickable‘.
Have a look at my site:
http://diekretzschmars.de
(links: Bilder – dropdown ‚Urlaub…‘ not accesable).
#nav ul { z-index:1; } seems to help.
Fixed in Webkit already.
Grüße
Ingo
--
http://www.satzansatz.de/css.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
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] What, o what am I doing?
Hi Renae, On 6/8/07, Renae Willis [EMAIL PROTECTED] wrote: 1. The p.normal tags aren't floating to the right of the thumbnails in FF2 the way I'd imagined they would the way that they do in IE6+7. Any suggestions on how I could fix this would be massively appreciated. It seems the p.normal style says to float:left. I've actually made the text that follows the thumbnails wrap to the right of the images by: ~ removing float:left from the p.normal style, and ~ adding float:left to the .thumb class style And I don't have IE 6 handy to check on the other issue, sorry. HTH, F. __ 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] Problem with conflicting header (I think)
Hi
If someone could help clue me in, I would REALLY appreciate it! I'm
relatively new to css, have been reading books and of course the list and
have gotten some good advice (Felix - fixed the font size!)
I think I have conflicting header but can't figure out what's going on. In
NN7, Firefox Mozilla it's got the conflict, but in IE7 it's working
correctly.
Here's what's going on: there's a ul Announcer menu that is floated to
the right around the main content. Somehow, the h4 header in the main
content is pushing the header in the ul down lower than it should be
(viewed in IE7 you can see what should be happening)
Here's the page:
http://www.kcsm.tv/jazz91/announcer_berzon.php
Here's the stylesheets
http://www.kcsm.tv/styles/global.css
http://www.kcsm.tv/styles/jazz91.css
I'm using a global stylesheet cuz there's two sections to this site that
look VERY different, and there's a jazz stylesheet to control what's
happening in this section. Additionally, in the header of each announcer
page I have the following style - needed cuz each page requires different
colors - I thought this was the best way cuz these styles are limited just
to these particular pages.
ul.announcer {
border-left: 1px solid #cc90f0;
float: right;
margin: 0 5px 10px 10px;
padding: 0 10px;
font-size: .8em;
color:#7817a1;
text-align: right;
list-style-type:none;
}
ul.announcer li a{
color:#7817a1;
text-decoration:none;
}
ul.announcer li a:hover{
color:#cc90f0;
text-decoration:underline;
}
h4.announcer {
text-align:right;
color:#7817a1;
margin-bottom: 10px;
}
Thanx for your help!!!
__
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] ADVICE NEEDED: CSS validation issues with javascript?
I am getting a number of CSS validation errors that seem to be referring to lines in the code where there is JavaScript running. At the moment I'm getting 28 errors! http://www.gwvirginia.gwu.edu/newsite/ (site under development) Is there a way to tell the Markup Validation Service that this is not CSS or HTML? Or does www.validator.w3.org http://www.validator.w3.org/ really check the JavaScript and this is an indication of a problem with the code? It scripts do seem to be functioning, so I'm confused. Thanks for telling me if there is a way to disable or whether I need to check further for some sort of script error (maybe a conflict between multiple scripts). I'm on the digest. Dova H. Wilson Marketing Communications Specialist George Washington University Virginia Campus 20101 Academic Way, Suite 134 Ashburn, Virginia 20147 Phone: 703-726-3652 Fax: 703-726-3655 www.gwvirginia.gwu.edu __ 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] ADVICE NEEDED: CSS validation issues with javascript?
* Dova Wilson wrote:
I am getting a number of CSS validation errors that seem to be referring
to lines in the code where there is JavaScript running. At the moment
I'm getting 28 errors!
http://www.gwvirginia.gwu.edu/newsite/ (site under development)
Is there a way to tell the Markup Validation Service that this is not
CSS or HTML? Or does www.validator.w3.org http://www.validator.w3.org/
really check the JavaScript and this is an indication of a problem with
the code? It scripts do seem to be functioning, so I'm confused.
You have code like
script ...
...
for (p=0;ptheimages.length;p++){
...
/script
In XHTML, you must not use or or ]] literally inside the script
element; if you have to use these characters, you should use an external
script, or at least write the code like so:
script ...
// ![CDATA[
...
for (p=0;ptheimages.length;p++){
...
// ]]
/script
The ![CDATA[...]] code is called a CDATA section; inside of it, you
can use the special characters and without escaping.
--
Björn Höhrmann · mailto:[EMAIL PROTECTED] · http://bjoern.hoehrmann.de
Weinh. Str. 22 · Telefon: +49(0)621/4309674 · http://www.bjoernsworld.de
68309 Mannheim · PGP Pub. KeyID: 0xA4357E78 · http://www.websitedev.de/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
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] Problem with conflicting header (I think)
Juanita wrote:
Hi
If someone could help clue me in, I would REALLY appreciate it! I'm
relatively new to css, have been reading books and of course the list and
have gotten some good advice (Felix - fixed the font size!)
I think I have conflicting header but can't figure out what's going on. In
NN7, Firefox Mozilla it's got the conflict, but in IE7 it's working
correctly.
Here's what's going on: there's a ul Announcer menu that is floated to
the right around the main content. Somehow, the h4 header in the main
content is pushing the header in the ul down lower than it should be
(viewed in IE7 you can see what should be happening)
Here's the page:
http://www.kcsm.tv/jazz91/announcer_berzon.php
Here's the stylesheets
http://www.kcsm.tv/styles/global.css
http://www.kcsm.tv/styles/jazz91.css
Hi Juanita. To fix your immediate problem simply add this:
h4.announcer {
margin: 0 0 10px 0;
}
However... check out your site in IE6, validate your code, then come
back for help if you need it :-)
--
Audra Coldiron
Rock-n-Roll Design Hosting
http://rock-n-roll-design.com
KarmaCMS ( http://karmawizard.com ) - the ultimate CSS styled CMS.
Pre-made designs, designer tools, and reseller program available!
__
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] Problem with conflicting header (I think)
Audra Coldiron [EMAIL PROTECTED] writes: However... check out your site in IE6, validate your code, then come back for help if you need it :-) -- Audra Coldiron Rock-n-Roll Design Hosting http://rock-n-roll-design.com Hi Audra - Thanx for that fix - Felix was nice enough to give me hint - and how I can install IE6 7 at the same time. Now that I see the problem, I am trying to find a fix for IE6, and I am currently changing some things around. Since I'm almost off for the day, I will work on it at home and if I can't figure it out - it's back to all the helpful people on the list for their advice. Maybe a hack is needed for IE6? Thanks for the help... Juanita __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Footer stick not going all the down.
I was doing SO good! All the way through the entire page without asking css-d for any help... then came the footer :( I tried FooterStick and FooterStickAlt and I get the same result: the footer starts at the bottom of the browser, not the bottom of the content (which would lead me to believe html, body, and the parent element don't have height:100%... but they do! Anyone see anything wrong with this? http://phazm.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/
