[css-d] IE8 rendering issue
I need some help with a rendering problem on IE8 that does not show on other
browsers including IE7, Firefox and Chrome. I am using an image replacement
technique for the title header. On IE8, there is a large gap at top of the
image so the backgrounds don't match up.
The website is http://piedmont-div.org/pilgrimage/ .
The CSS in question is :
#header h1 {
background: transparent url(/pilgrimage/images/pp_title.jpg) no-repeat top
left;
margin: 0;
padding: 0;
font-size: 3em;
font-weight: bold;
overflow:hidden;
text-indent:-5000px;
height:79px;
}
The HTML is
h1Piedmont Pilgrimage/h1
I thought this might be related to a hasLayout issue. But adding zoom:1 did
not seem to help.
Any assistance would be appreciated.
Regards,
Scott Povlot
__
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] CSS and Yahoo Maps
I am having some problems trying to position Yahoo Maps with CSS. I have embedded an AJAX Yahoo Map (http://developer.yahoo.com/maps/ajax/) in a webpage. The maps are generated dynamically with Javscript so I am not exactly sure what is going on. The map is within a container div that is floated to the right. You can see a sample web page at http://www.piedmont-div.org/pilgrimage/tour_date20081101.html . The CSS is at http://www.piedmont-div.org/pilgrimage/css/styles.css . The page looks good in Firefox. In IE7, the mapcontainer shifts around when you resize the browser. On IE6, the map moves out of the containing box and almost off the page. Very strange indeed. Any help you can provide would be appreciated. Scott Povlot __ css-discuss [EMAIL PROTECTED] 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] Paragraph background not respecting float margins
I hope that someone can explain to me what is happening in this case. The paragraph with the yellow background should be pushed over by the float. The text in it is moved over due to the float. But the yellow background still continues behind the float box. I think that the background and border should be moved by the float. Here is the URL: http://test.nmra.org/education/achievement/def.html Thanks for your help. Scott Povlot __ Do You Yahoo!? Tired of spam? Yahoo! Mail has the best spam protection around http://mail.yahoo.com __ css-discuss [EMAIL PROTECTED] 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] Page check
I have just finished a new page design. This is my first using a fixed width page. It looks OK on Windows IE6/7 and Firefox. Can you please validate on other OS and browsers? Also, any comments on the design would be appreciated. The URL is http://www.piedmont-div.org/nmra/nmra_home_page.html Thanks very much, Scott Povlot Luggage? GPS? Comic books? Check out fitting gifts for grads at Yahoo! Search http://search.yahoo.com/search?fr=oni_on_mailp=graduation+giftscs=bz __ css-discuss [EMAIL PROTECTED] 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] Page check
Thanks, David. I changed the #shop width to 200px. That's much better. However, I am not sure what you mean about Eighty percent of default (on body) is kind of tiny start point for those using a high dpi monitor. What resolution are you using? What do you suggest for a font setting? Scott --- David Laakso [EMAIL PROTECTED] wrote: Scott Povlot wrote: The URL is http://www.piedmont-div.org/nmra/nmra_home_page.html Scott, I'd suggest setting the width of #shop from the em width you have to around 200px (to keep it from expanding horiz and dropping th float w/ font-scaling). The set of links at the bottom right corner of the page break as well. Eighty percent of default (on body) is kind of tiny start point for those using a high dpi monitor. -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] 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/ Be a better Globetrotter. Get better travel answers from someone who knows. Yahoo! Answers - Check it out. http://answers.yahoo.com/dir/?link=listsid=396545469 __ css-discuss [EMAIL PROTECTED] 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] Margin vs. Padding
I think this is a simple question. And perhaps there is no straight answer. If I don't have a border, what is the difference between using padding or margin to add space around an element? Is there any reason to choose one over the other? Thanks, Scott Need a vacation? Get great deals to amazing places on Yahoo! Travel. http://travel.yahoo.com/ __ css-discuss [EMAIL PROTECTED] 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 help with css in firefox
Firefox does not seem to be reading the CSS file for
some of your pages such as the Home page. This seems
to be a problem with the encoding which is set to
UTF-16LE on these pages. You can see this by looking
at the Page Info (under Tools menu). Other pages such
as Contact Us seem to be displayed OK.
This is probably a problem with your web server or how
you saved the pages. The default encoding should be
ISO-8859-1.
Regards,
Scott Povlot
--- Matt Kruger [EMAIL PROTECTED] wrote:
Hello all,
Im currently working as an intern for a reputable
machine shop in Cleveland
and was tasked with revamping their very basic
website. Im still in college
and havn't had much formal training in web
development. I found a very cool
CSS template online and have recently finished
adding all the content from
the old site.
The site is www.techmach.com It looks great in IE
but really poor in
firefox and netscape. My main concern at the moment
is getting the links on
the top and sidebar formatted correctly, the rest I
can test and play with
more casually. Here is the related code from one of
the pages as well as the
css:
CSS:
td {
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #343B4D;
}
a img {border: none; }
.menu_link {
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #FF;
font-weight: bold;
text-decoration: none;
}
.menu_link:hover {
color: #C9C8C3;
}
.link_1 {
font-family: Tahoma, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FF;
text-decoration: none;
}
.link_1:hover {
text-decoration: underline;
}
.link_2 {
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #FF6501;
text-decoration: none;
}
.link_2:hover {
text-decoration: underline;
}
.link_3 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #333A4D;
text-decoration: underline;
}
.link_3:hover {
color: #999FAF;
}
.searchformtd {
border-top: 1px solid #5E5E5E;
border-left: 1px solid #8D8D8D;
border-right: 1px solid #E7E7E7;
border-bottom: 1px solid #E7E7E7;
}
.caption_1 {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #00;
}
.caption_2 {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #FF6501;
}
.caption_3 {
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
font-weight: bold;
color: #303749;
}
.inp_1 {
border: 1px solid #414D73;
width: 132px;
height: 22px;
background-color: #FCFCFC;
}
form {
margin: 0px;
}
.aligner {
text-align: justify;
}
.spacer_1 {
margin: 2px 10px 2px 5px;
}
.spacer_2 {
margin-bottom: 3px;
}
.spacer_3 {
margin: 6px 8px 6px 8px;
}
.spacer_4 {
margin: 11px 14px 11px 14px;
}
.text_1 {
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
color: #220C01;
}
.text_2 {
font-weight: bold;
text-decoration: underline;
}
.img_spacer {
margin-right: 9px;
}
Portion from the html:
!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01
Transitional//EN
http://www.w3.org/TR/html4/loose.dtd;
html
head
titleTMP - Hydraulic Presses, Rubber Machinery,
Injection Presses,
Rubber Mixers, Lamination Presses/title
meta name=description content=Technical Machine
Products (TMP), is
an innovative designer, manufacturer, rebuilder, and
servicer of
hydraulic presses, laminators, intensive mixers, and
related
components, controls, and auxiliary equipment. /
meta name=keywords content=hydraulic presses,
hydraulic press,
TMP, used machinery, injection, compression presses,
heavy machining,
rebuilt equipment, preowned equipment, press
rebuilding, hydraulic
laminator, rubber and silicone compounding,
compression press, vacuum
presses, lab equipment, laboratory presses, rubber
and silicome
molding, rubber mixing, plastic card lamination,
circuit board
lamination, rubber and silicone compounding,
laboratory mills, lab
mixers, rubber silicone composite and resin-transfer
molding, resin
transfer molding, composite molding, silicone
molding /
meta http-equiv=Content-Type content=text/html;
charset=iso-8859-1
link href=images/style.css rel=stylesheet
type=text/css
/head
body bgcolor=#FDFDFD topmargin=0
leftmargin=0 marginheight=0
marginwidth=0
table align=center width=780 border=0
cellspacing=0 cellpadding=0
tr
td colspan=4 style=height: 100pximg
src=images/header.jpg
width=780 height=100/td
/tr
tr
td width=20 style=height: 27px img
src=images/header_part01.jpg width=20
height=27/td
td width=186
background=images/header_part02.gif
style=height: 27pximg src=images
Re: [css-d] print label from web browser
Hiep, You may be able do to this in CSS if you restrict the format to fixed width fonts with text only. This may work for a dot matrix printer. But for anything that requires specific layout such as laser print multi-column labels, I would suggest looking into a server-side solution that creates a PDF. You can google pdf and php to find more information on this. Regards, Scott Povlot --- Hiep Nguyen [EMAIL PROTECTED] wrote: hi there, i'm writing a simple web application using mysql php. what i want is to do allow users to print continuous label (7.5x3.5 in) on dot matrix printer. my question is can css do this? If so, can some one gives some advises or point me to the right direction. thank you, T. Hiep Boardwalk for $500? In 2007? Ha! Play Monopoly Here and Now (it's updated for today's economy) at Yahoo! Games. http://get.games.yahoo.com/proddesc?gamekey=monopolyherenow __ css-discuss [EMAIL PROTECTED] 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] layout column height adjustment...
Mike, I suggest you look on the CSS-Discuss wiki at http://css-discuss.incutio.com/?page=AnyColumnLongest Also, when you post, I suggest that you limit the use of The URL to your website was broken because of them. Regards, Scott Povlot --- Michael Forker [EMAIL PROTECTED] wrote: Hi the problem is that with the layout in the pages when I put content into the various pages differing on each pagethe layout columns at the bottom of the pages are not equal as in on each page the length of the columns are diiferent on the different pages the left column...middle column...right column.on different pages are different lengths.tried adjusting the top:200px; rule which did work at the bottom of the column but shifted the position at the top.the link to my site Pinpoint customers who are looking for what you sell. http://searchmarketing.yahoo.com/ __ css-discuss [EMAIL PROTECTED] 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] Floated Images disappear in IE6
I recently redesigned one of my websites. Now some images (floated right) are no longer showing on Internet Explorer 6 (IE6). I think this may be a box model issue. But the hacks I have tried haven't fixed it. This site works in IE7 and Firefox. Can someone please help me fix this? The page : http://www.piedmont-div.org/pilgrimage/layouts/layout_tweldon.html CSS: http://www.piedmont-div.org/pilgrimage/css/styles.css Also, any comments on the design are appreciated. Regards, Scott Povlot [EMAIL PROTECTED] Shape Yahoo! in your own image. Join our Network Research Panel today! http://surveylink.yahoo.com/gmrs/yahoo_panel_invite.asp?a=7 __ 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] Floated Images disappear in IE6
Thanks very much, Georg.
Just wondering how you determined this (so that I can
learn a little for next time). Is this a documented
bug? Any links you can provide would be helpful.
Regards,
Scott
--- Gunlaug Sørtun [EMAIL PROTECTED] wrote:
Nothing to do with the box model, but everything to
do with IE6' faulty stacking of elements.
The addition of...
img.layout {position: relative;}
...will make that bugger come to its senses.
regards
Georg
Pinpoint customers who are looking for what you sell.
http://searchmarketing.yahoo.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] multiple style sheet errors
Copeland, This is not a CSS problem. Your problem is related to the Javascript that disables the stylesheets. In Firebug, I see the following error: document.styleSheets is not a function [Break on this error] document.styleSheets(1).disabled = false; Basically, styleSheets is an array and needs to be referenced using square brackets [ ] instead of parentheses. Regards, Scott Povlot --- Copeland [EMAIL PROTECTED] wrote: I have javascript that says to go to the first stylesheet unless the user wants larger text at which point they go to another linked stylesheet that is otherwise disabled. BUT when I link those two stylesheets next to each other the main content area goes -boom- all the way down the page. These 2 stylesheets are named differently but I also tried it with the same stylesheet, just listing it twice (so nothing should change) and it did the same thing! Anyone have any ideas??? You can see it at HYPERLINK http://www.messiahvillage.org/indexnew.htm; Shape Yahoo! in your own image. Join our Network Research Panel today! http://surveylink.yahoo.com/gmrs/yahoo_panel_invite.asp?a=7 __ 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] Repeat-x problems when the window is smaller than 800x600
Erik, The problem you are having is not related to repeat-x, but width. Your subwrapper div has a fixed width of 780px. Your body has a min-width of 100%. But the body width does not take into account the width of the subwrapper. (Not 100% sure why). If you change the body min-width=780px, the problem is resolved. Perhaps someone else can explain why 100% does not work properly. Scott --- Erik Gyepes [EMAIL PROTECTED] wrote: I'm designing a layout where the /header/ and also the /banner/ (under it) use repeat-x to be repeated on the x axis. The problem occurs when I resize the window to 800x600 to see how it looks like on 800x600 desktop and then resize the window a little more - because I want a horizontal scrollbar to appear. Then when I scroll horizontally to right there is a gap on the right side of the /header/ and the /banner/. I would like to repeat the header and the banner till to the window border, but it just stop repeating. Choose the right car based on your needs. Check out Yahoo! Autos new Car Finder tool. http://autos.yahoo.com/carfinder/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS Tabular Layout
Jason,
Both Photos and Members Online are simple lists. A list of images and a list
of users. So, use a unordered list (ul). You can float the list items to
make a multi-column display.
For example:
h2Members Online/h2
ul id=online
listeve0727/li
liwhatsis/li
liaudiosl_99/li
...
/ul
CSS:
ul#online {
list-style-image:none;
margin: 0;
padding: 0;
}
ul#online li {
float:left;
width:20em;
}
Regards,
Scott Povlot
Jason Ogle [EMAIL PROTECTED] wrote:
What is the ideal way to layout the Photos and Members Online
sections??
-
Get your own web address.
Have a HUGE year through Yahoo! Small Business.
__
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] Rollovers (hovers) not working in Firefox
Kathi,
The problem is related to the absolute positioned title that is blocking the
menu items.
Here is the CSS fix that changes the title to relative positioning.
#pagetitle_ma
{
left:250px;
position:relative;
top:120px;
width:540px;
}
Regards,
Scott Povlot
- Original Message
From: Kathi Cushman [EMAIL PROTECTED]
To: css-d@lists.css-discuss.org
Sent: Tuesday, March 27, 2007 3:35:38 PM
Subject: [css-d] Rollovers (hovers) not working in Firefox
Hi all,
First of all, I'm fairly new to CSS and taking over for my partner, so
there's probably a better way of doing things than the method I'm using.
On this page, my hovers for the horizontal bar of main navs doesn't work in
Firefox, except for the first 3. I used the same code for another site that
used horizontal navs and worked fine in all browsers. For the life of me, I
can't seem to figure this out.
http://www.igryphon.com/microtia_final/age-to-begin.html
On a side note, the horizontal nav bar is made up of one horizontal div,
then individual divs nested in it for each nav button. I would rather
have had the buttons all in the one larger div, but I couldn't get them to
display in a row, even when I changed display: block to display: inline.
If you have any input I'd sure appreciate it.
__
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/
Finding fabulous fares is fun.
Let Yahoo! FareChase search your favorite travel sites to find flight and hotel
bargains.
http://farechase.yahoo.com/promo-generic-14795097
__
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] A huge space in IE... any reason why?
Well, I am not 100% sure what the problem is. Maybe it is related to this IE6
float problem (http://www.positioniseverything.net/explorer/doubled-margin.html)
But this will fix the problem.
form {float: left;}
This is a sort of ''fix a float with a float'' solution.
(http://www.complexspiral.com/publications/containing-floats/)
Regards,
Scott Povlot
- Original Message
From: Michael Stevens [EMAIL PROTECTED]
Subject: [css-d] A huge space in IE... any reason why?
www.jimbarnettconsulting.com/contact.html
www.jimbarnettconsulting.com/short_form.html
www.jimbarnettconsulting.com/jbc.css
Of course, it's fine in FireFox...
Every page on the site is identical except what's between the content DIVs.
The only difference on these pages is the form in use. I did validate it and
fixed some errors with where the input elements were placed but, as I knew,
that didn't solve anything.
Expecting? Get great news right away with email Auto-Check.
Try the Yahoo! Mail Beta.
http://advision.webevents.yahoo.com/mailbeta/newmail_tools.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] why won't my class change the font?
http://www.mocap.com/_temp/insidepage.asp
I can't figure out why the text on the right side, which has a class of
smallcaption, is not 8pt? For some reason, the font of of the article
class seems to over-ride smallcaption.
The problem here is CSS specificity. Your .smallcaption class is overridden
by the .article p which also sets the font size. If you change your
.smallcaption to p.smallcaption or add another version such as .article p
.smallcaption, your problem will be solved.
Also, can someone tell me how to make the underline stop showing up when
hovering over the free samples button and the size charts button? This
causes the page to grow and shrink in FF. :(
Change your a:hover to remove the bottom border as follows:
a:hover {
border-bottom:0;
text-decoration:none;
}
Regards,
Scott Povlot
Don't pick lemons.
See all the new 2007 cars at Yahoo! Autos.
http://autos.yahoo.com/new_cars.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Dotted Box
The dotted box is the focus that appears on the current link. If you tab around the browser, you will notice that this moves to each link. There is not a simple way to remove this. And if you do, you may have a usability/accessibility problem. There is a solution available on CSSPlay at Removing active/focus state borders (http://www.cssplay.co.uk/menu/nodots.html). But this seems more complicated than what it's worth, IMHO. Scott - Original Message From: Steve LaBadie [EMAIL PROTECTED] To: css-d@lists.css-discuss.org Sent: Friday, January 5, 2007 9:12:02 AM Subject: [css-d] Dotted Box Is there away to prevent the dotted box that appears around a link after you click on it? If I refresh the page it goes away. Steve LaBadie, Web Manager East Stroudsburg University 200 Prospect St. East Stroudsburg, Pa 18301 570-422-3999 [EMAIL PROTECTED] mailto:[EMAIL PROTECTED] http://www.esu.edu http://www3.esu.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/ __ Do You Yahoo!? Tired of spam? Yahoo! Mail has the best spam protection around http://mail.yahoo.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problem overlap in IE7 (PLEASE)
I think that my email may have been lost in the shuffle when the list was down. Can someone please help me with this problem on IE7? Thanks! Scott - Original Message From: Scott Povlot [EMAIL PROTECTED] To: css-d@lists.css-discuss.org Sent: Wednesday, January 3, 2007 2:15:55 PM Subject: [css-d] Problem overlap in IE7 I need some help on IE7. I have a website that works well on IE6, FF and Opera. But on IE7, the content text overlaps the sidebar on the right. The content area has a 13em right margin. And the sidebar (Upcoming Events) is positioned absolutely at the right on 0. Website: http://www.piedmont-div.org/ CSS: http://www.piedmont-div.org/css/styles.css Any suggestions on fixing this problem in IE7 would be helpful. Thanks, Scott __ Do You Yahoo!? Tired of spam? Yahoo! Mail has the best spam protection around http://mail.yahoo.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ Do You Yahoo!? Tired of spam? Yahoo! Mail has the best spam protection around http://mail.yahoo.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Floating Absolute Positioning
Cody, Basically, absolute positioning and variable font sizes don't mix. I would suggest that you try the layout without absolute positioning. You can easily do this by removing the position: absolute and top attributes and changing left to margin-left. Then you can set a min-height (and height on IE) to the appropriate size that you choose. Then everything will be in the normal document flow. (Oh, you might need to move your image on the left to a float or a background.) And the thumbnails will only move down if the text gets larger than the min-height. Regards, Scott - Original Message From: Cody Thornton [EMAIL PROTECTED] To: css-d@lists.css-discuss.org Sent: Friday, January 5, 2007 12:27:16 PM Subject: [css-d] Floating Absolute Positioning At this site http://www.matthew-cunningham.com/frontridge/project.html there is a row of thumbnail images that risk overtaking the text if the viewer has the font size set larger than normal (the text wraps under the thumbnails). I want the absolute position of the row of thumbnails to hold among all of the projects EXCEPT in the rare case that the text is too large to fit in that space. You can see what I mean by clicking on the project arrows to go from project to project. Is there a way to give those thumbnails an absolute position except when it needs to be pushed down? Thanks in advance! I'm very new to CSS. Cody __ 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/ __ Do You Yahoo!? Tired of spam? Yahoo! Mail has the best spam protection around http://mail.yahoo.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Changing cursor for image maps
Sorry about the last message. Adding a class to the seems to work in Firefox. But not on IE. You might try some other option instead of an image map. See http://www.alistapart.com/articles/imagemap/ for an example. Scott __ Do You Yahoo!? Tired of spam? Yahoo! Mail has the best spam protection around http://mail.yahoo.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Changing cursor for image maps
Don, ... I have tried adding a class and an id and even a span but none will change the cursor type on an image map link. ... __ Do You Yahoo!? Tired of spam? Yahoo! Mail has the best spam protection around http://mail.yahoo.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Problem overlap in IE7
I need some help on IE7. I have a website that works well on IE6, FF and Opera. But on IE7, the content text overlaps the sidebar on the right. The content area has a 13em right margin. And the sidebar (Upcoming Events) is positioned absolutely at the right on 0. Website: http://www.piedmont-div.org/ CSS: http://www.piedmont-div.org/css/styles.css Any suggestions on fixing this problem in IE7 would be helpful. Thanks, Scott __ Do You Yahoo!? Tired of spam? Yahoo! Mail has the best spam protection around http://mail.yahoo.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] first posting
Ana,
Basically, you have several ul li rules that override each other. To make
them specific to the globalNavi or subNavi, you need to make them more specific
with a descendant selector. For example:
#globalNavi ul li {
margin: 0;
padding: 0;
}
I would suggest that you review some tutorials on CSS selectors. I suggest
Selectutorial (http://css.maxdesign.com.au/selectutorial/index.htm) or WestCiv
(http://www.westciv.com/style_master/house/index.html).
Also, regarding the order of your items in the globalNavi, the problem is that
the individual li are floated right. I think that you just want to float the
ul to the right. But leave the li alone.
Let us know if you need more assistance.
Regards,
Scott Povlot
- Original Message
From: Ana Aguilar [EMAIL PROTECTED]
To: css-d@lists.css-discuss.org
Sent: Thursday, December 7, 2006 10:32:47 AM
Subject: [css-d] first posting
Hi there,
I am working on a portfolio-kind-of page and got a couple of problems I don't
know how to solve.
1. I have two navis one I called globalNavi, and another subnavi .
Somehow when I modify the subnavi, the globalNavi gets modified as well and I
dont want that. How can I modify the subnavi so it acts independent of the other
navi? where is/are the mistake(s)?
2. Why is the order in my globalNavi not working? If you notice in the code
whatever I have in the first li (home) appears on the last tab!
the layout:
http://preview.aguilar-hauke.de/Sites/test/print.html
the css:
http://preview.aguilar-hauke.de/Sites/test/styles/master.css
Could someone help me, please?
Thanks
Ana
-
Have a burning question? Go to Yahoo! Answers and get answers from real people
who know.
__
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/
Need a quick answer? Get one in minutes from people who know.
Ask your question on www.Answers.yahoo.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Applying CSS to forms
The simplest solution seems to be to remove the float:right and
display:block from the label.
label { width: 100px; text-align: right; margin-right: 10px; }
Generally, I would suggest working with the base styles as much as possible
before using floats to change the layout. By setting the float, you moved only
the labels out of the normal flow of the document. The inputs were still in
the normal flow. You could have also floated the inputs left to fix this. But
go with the normal document flow instead.
Also, there seemed to be a problem with your URL when you posted. Here is the
complete URL: http://web.asylumweb.net/FormTest.html
Regards,
Scott Povlot
- Original Message
From: Steve Craig [EMAIL PROTECTED]
To: css-d@lists.css-discuss.org
Sent: Tuesday, December 5, 2006 5:46:53 AM
Subject: [css-d] Applying CSS to forms
Hi
In an effort to get rid of some more tables and streamline my code a
bit I took a look at this page on styling forms...
http://www.webcredible.co.uk/user-friendly-resources/css/css-forms.shtml
...and everything went well until I tried to put a couple of input
fields side by side instead of vertically.
A sample page of the problem is here http://web.asylumweb.net/
FormTest.html
Anyone any ideas how I can get the surname label to sit correctly?
Thanks for any help.
Steve Craig - Asylum Interactive Ltd
Tel +44 1330 860550 Fax +44 1330 860880
http://www.asylumweb.com
Email: [EMAIL PROTECTED]
Skype: s.craig - iChat: steve.craig
__
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/
Cheap talk?
Check out Yahoo! Messenger's low PC-to-Phone call rates.
http://voice.yahoo.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Floating list Elements in Nested lists
Bruce,
Add clear:none to the ul.amenities li style. This will override the
clear:both from the .room li style. The problem is that you are floating and
clearing the same li.
ul.amenities li {
float:left;
padding:0;
margin:.5em .25em;
width:45%;
clear:none;
}Regards,
Scott
- Original Message
From: Bruce Hodo [EMAIL PROTECTED]
To: css-d@lists.css-discuss.org
Sent: Tuesday, September 19, 2006 10:13:13 AM
Subject: [css-d] Floating list Elements in Nested lists
I would like to have a second level nested list floated in such a way that the
elements line up (in this case) in two columns. Doing this in a non-nested list
works fine, but the nest lists do not float: they line up as if float was not
coded. The list elements have a defined width that is slightly less than half
of the width of the ul, which should give me a two column layout. But it
doesn't.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] text-align: right
I am having a problem aligning text on the right. Oddly, my CSS works in
IE6/Win but is not working on Firefox. The website is
http://www.piedmont-div.org/ser2007/ . In the header, there is a Sponsor By
paragraph that should be right aligned. On Firefox, the text shows as left
aligned.
div id=sponsor
pSponsoredbrBy /p
a href=http://www.digitrax.com/;
img src=/ser2007/images/digitrax_logo.jpg alt=Digitrax, Inc.
/a
/div
Here is the area of the CSS
(http://www.piedmont-div.org/ser2007/css/styles.css) that effects this XHTML.
#header #sponsor {
float: right;
margin-right: 50px;
}
#header #sponsor p {
float: left;
padding: 5px 10px;
font-size: 1.1em;
font-weight: bold;
text-align: right;
}
#header #sponsor img {
position: static;
}I am not sure if the problem is related to all of the floats. Normally, I
would expect Firefox to show correctly and IE to have the problems. ;-)
Any help would be appreciated.
Scott
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] text-align: right
Thanks. That seems to work. Can you tell me why I would need it on the in the
parent div instead of on the p tag?
Scott
#header #sponsor {
float: right;
margin-right: 50px;
text-align: right; /* i added this */
}
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] Floated list items cause extra space on Firefox
I am working on my first CSS/XHTML website. I hope
that you can help with an unusual problem that I am
seeing in Mozilla Firefox 1.04.
I am using a floated list item li to make multiple
columns. This is similar to the gallery example in
http://css-discuss.incutio.com/?page=GalleryFloat.
The problem is that I see a large gap at the bottom of
the page in Firefox. This problem does not occur in
IE.
Here is the sample page:
http://www.piedmont-div.org/test/hobbyshops.html
CSS: http://www.piedmont-div.org/test/css/styles.css
Here is the section of CSS that I use to make the 2
columns.
#content #board li,
#content #hobbyshops li {
width: 20em;
list-style-type: none;
font-size: 1.2em;
color: #000;
font-weight: bold;
float: left;
}
#content #board li li,
#content #hobbyshops li li {
font-size: 0.8em;
font-weight: normal;
float: none;
margin: 0;
}
Thanks very much for your help.
Scott
__
Discover Yahoo!
Have fun online with music videos, cool games, IM and more. Check it out!
http://discover.yahoo.com/online.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
