[css-d] descenders disappearing in IE
I added a linked image to the left of an image on a page: www.melvillekidsdentistry.com I haven't been happy with the difference between the placement of the image headline between Safari, FF, and IE — with IE being the problem. After playing around with it, it looks a bit better in IE, but with some more fiddling I floated the image to the right and I liked it better. www.melvillekidsdentistry.com/index2.html BUT in the float right version, in IE the the headline descenders for the letters y g appear to be covered up. I cannot figure out why — if anyone has an answer for I would appreciate it. Linda Quinn www.digitalquinn.com Photography takes an instant out of time, altering life by holding it still. Dorothea Lange __ 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] text align problem
I am working on a rather involved site — it started as a simple job that grew exponentially, and I guess I ended up repeating some of the css rules in subsequent files. The problem I am having is that I cannot get paragraph text that does not take up a full line to align left. If you look at this page: http://www.melvillekidsdentistry.com/beta2/pages/kids/prevent.html you can see that the Q's are centered and the A's are left justified. Both a p tags in the same div, and set to text-align:left. I have looked through all the code, and cannot find the conflict, although there must be one. Any suggestions on where I can look? Thanks, LindaQ Linda Quinn www.digitalquinn.com Photography takes an instant out of time, altering life by holding it still. Dorothea Lange __ 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 color declaration not working!
CSS color declaration not working!
I have been using a CLASS tag as a method of highlighting a menu item
to denote that the page being viewed. All of a sudden the color
declaration in parts of the code is not working in Safari Firefox.
It appears to be working in IE 8 - haven't checked 7 or lower yet.
The CSS code:
#header ul#navbar a.top {
color:#f1e1bc;;
padding:.36em;
font-size:1.3em;
}
#header ul#navbar a.top:hover {
color:#f1e1bc;
padding:.36em;
background-color:transparent;
}
#header ul#navlist a.main {
color:#39c;
padding:.36em;
font-size:1.3em;
}
#header ul#navlist a.main:hover {
color:#39c;
padding:.36em;
background-color:transparent;
}
#footer a.foot{
background-color:transparent;
color:#39c;
font-size:1.2em;
}
The page can be seen at: http://www.melvillekidsdentistry.com/beta2/index.html
(note that this is up as a sample and linked pages are not present).
The first two declaration blocks (#header ul#navbar) work, but are not
active on the linked page. The last one (#footer) is at the bottom of
the page and works.
The middle two are the problem (#header ul#navlist). In a.main the
color does not work, but the padding font-size do. In a.main:hover
the color works, but not the padding. I know I must have done
something to cause this problem, but I have tried every combination
and I cannot figure it out.
Thanks for any suggestions. LindaQ
Linda Quinn
www.digitalquinn.com
Photography takes an instant out of time, altering life by holding it
still. Dorothea Lange
__
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] A better way to show photos with a bio?
I have a page that lists instructors with their bios, and the bios
are of varying lengths. I recently added photos for some of the
instructors, and in the case of people with short bios, the spacing
doesn't look very good.
www.lifeonwheels.com/pages/instructors.htm
The html for each bio is the same. pimg scr=photo filename /
text of bio /p. The following html shows two listing that do not
have enough space between them, because the first one is very short.
pimg src=../images/instructors/Dippel-JJ.jpg/spanJJ DIPPEL/
spanhellip;is a retired federal auditor, has been RVing for three
years and fulltimed for the last ten months.nbsp; She as a personal
interest in privacy issues and is the author of emRV Living and
Privacy Protection/em article posted at PrivacyRights.org. (Idaho)
/p
pimg src=../images/instructors/Ghylin-Clay.jpg /spanCLAY
GHYLIN/spanhellip; is a Certified Composite Technician-Marine,
with American Composites Manufacturers Association.nbsp; Clay is
currently the foreman for the 'Polynesian Voyaging Society' in
Honolulu Hawaii building the 'plug','mold', and hulls',from design to
completed boats for 45 foot double sailing canoes.nbsp; Before
Hawaii, Clay built and repaired private boats and historical vessels,
(like the 'Virginia 5', a historic ferry), in and around the Seattle
area. (Idaho)/p
The css that manages the image and paragraph space is:
#infotext img {
float:left;
padding-right:10px;
}
After adding the photos I also added padding to the bottom of the
paragraphs:
#infotext p{
padding-bottom:20px;
}
Any suggestions how I can create spacing that will look good even
when there is very little bio text?
Thanks much. Linda Quinn
__
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 better way to show photos with a bio?
Maruricio -
Yes! Thank-you so much. I replaced the existing #infotext p code with
your suggestion and it gave me just the spacing I wanted. Now I need
to go through your code carefully to see that I really understand it.
Best regards, Linda Quinn
On May 30, 2007, at 11:22 AM, Mauricio Samy Silva wrote:
From: Linda Quinn [EMAIL PROTECTED]
I have a page that lists instructors with their bios, and the bios
are of varying lengths. I recently added photos for some of the
instructors, and in the case of people with short bios, the spacing
doesn't look very good.
www.lifeonwheels.com/pages/instructors.htm
-
Hi Linda,
Clear the paragraph that encloses the image and bios text and set
a bottom margin.
Add the following to your CSS:
#infotext p {
width:100%;
overflow:auto;
margin-bottom:5px; /* or another value at your taste */
}
Regards
Maurício Samy Silva
http://www.maujor.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 in Firefox/Mac
I have a CSS based site that is working in IE7 FIrefox on the PC, and Safari/Mac, but it does not render correctly in Firefox/Mac. All of the XHTML validates, as do all the CSS files. The URL is www.lifeonwheels.com (the Links Sponsors pages have not been updated from the old site, so they are not relevant) The two primary css files can be viewed at www.lifeonwheels.com/pages/ all_pages.css.pdf and www.lifeonwheels.com/pages/conf.css.pdf . As its name states, the all_pages.css file, is used by all pages. The conf.css file is used by the Conference page and the Arizona, Kentucky, Idaho, Pennsylvania, Iowa information pages. Initially I had a problem with some of columns displaying correctly in FF/PC, but it corrected when I changed a column width from percents to pixels. I would appreciate any ideas I why the site does not render correct in FF/Mac. Thanks. __ 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] pseudo-class link problems - again
I am repeating my post from yesterday, because I had a typo in the
link to the site. Thanks
I am using pseudo-classes on my links. They all work as they should,
in all browsers, on text links, but I am having trouble with image
links.
The site is: www.lifeonwheels.com/beta2/index5.htm
Looking at the sponsor logos on the right side of the page, the
images should not have a border in their normal state or if they have
been visited. Hover should produce a blue border.
At the moment, the CSS is:
#rightcolumn #sponsorimages a {
border-color:transparent;
}
#rightcolumn #sponsorimages a:link {
border-color:transparent;
}
#rightcolumn #sponsorimages a:visited {
border-color:transparent;
}
#rightcolumn #sponsorimages a:hover {
border:3px solid #009;
}
1. In Safari/Mac nothing at all happens - no borders at all, even on
Hover.
2. FF/Mac Win works.
3. Netscape/Win works.
4. IE6/Win the blue border appears in normal state and on Hover
(therefore, no hover visual effect) AND visited links appear purple.
Obviously, my main concern is IE6/Win. Any ideas that will help me
fix the code?
Thanks, LindaQ
__
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] pseudo-class link problems
I am using pseudo-classes on my links. They all work as they should,
in all browsers, on text links, but I am having trouble with image
links.
The site is: www.lifeonwheels.com/beta2/index5.hml
Looking at the sponsor logos on the right side of the page, the
images should not have a border in their normal state or if they have
been visited. Hover should produce a blue border.
At the moment, the CSS is:
#rightcolumn #sponsorimages a {
border-color:transparent;
}
#rightcolumn #sponsorimages a:link {
border-color:transparent;
}
#rightcolumn #sponsorimages a:visited {
border-color:transparent;
}
#rightcolumn #sponsorimages a:hover {
border:3px solid #009;
}
1. In Safari/Mac nothing at all happens - no borders at all, even on
Hover.
2. FF/Mac Win works.
3. Netscape/Win works.
4. IE6/Win the blue border appears in normal state and on Hover
(therefore, no hover visual effect) AND visited links appear purple.
Obviously, my main concern is IE6/Win. Any ideas that will help me
fix the code?
Thanks, LindaQ
__
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] missing margin on link image
Please help me understand what is happening. I have a column of
images (actually the logos of an organization's sponsors) and each
one will link to the sponsors' web sites. To make is obvious that
they are links, I thought I would have a border appear on hover.
Works in FF, but not in IE6/Win or Safari/Mac.
This is the page: www.lifeonwheels.com/beta2
The image links are contained in a div with an id of sponsorimages.
The CSS includes:
#sponsorimages a:link {
color:#fff;
}
#sponsorimages a:hover {
color:#009;
}
In FF - bring the mouse over a logo and the a blue border appears -
as it should.
In Safari/Mac - the links work, but the border never appears.
In IE6/Win - the borders are always there!
Thanks for any explanations - and better yet for a fix! LindaQ
__
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] IE border quirk
Something strange is happening in IE6 (as usual). I am creating a
page, using Safari/Mac as my default browser - then every time I
upload a change I check it on PC in IE6/Win. Everything was laid out
in the correct position on both browsers - the page can be seen at:
www.lifeonwheels.com/beta2.
Under the heading are two columns, followed by a footer. At this
point the right column is complete, and I am still adding the left
column content. To help in troubleshooting, I originally placed a
border around the entire page and around the two columns. I removed
both borders to see how things looked - and in IE6/Win the left
column moved under the right column. Turned out that the border
around the two columns is creating the problem. If I remove it (first
line in #colunmwrapper, below) or, if I put in a column style of
none, the problem occurs.
#columnwrapper {
border:0.1em solid white;
border-bottom:5px solid #c90;
padding-bottom:5px;
position:relative;
}
Since my client was going to be viewing the page this weekend, I put
in an invisible border, reflected in the CSS rule above. Note that
the border-bottom (line 2) is part of the design.
Question - why would removing the border declaration cause the entire
left column to move? It was my understanding that a border is not
part of the actual container, only an outline. FYI, the initial CSS
rule for the left column is:
#leftcolumn {
position:absolute;
width:690px;
overflow:hidden;
}
Any help in understanding why this is happening would be appreciated.
Thanks, LindaQ
__
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] centering images
I must be missing something in centering images. The following CSS is
set up to contain the contents of a page, and center the contents
regardless of the size the browser window is set.
#pagewrapper {
min-width:780px;
max-width:950px;
margin-left:auto;
margin-right:auto;
margin-top:0;
text-align:left;
padding:5px 0 0 5px;
border:2px solid #cd9923;
}
This works in Safari (Mac) FF, but in IE6/Win, the container grows
when the browser window is made larger.
Thanks for any help. LindaQ
__
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] centering images
Thanks for the followup discussion on min/max width in IE. Daniel's suggestion of adding a width declaration above the min/max width declarations does make the page look better in IE. Thanks! __ 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] background/menu missing in IE6
I laid out a page with the markup, and just started formatting with
CSS. I have the page header positioned in CSS, and it looks fine in
Safari and Firefox on the Mac. In both IE6 Firefox on the PC both
the header background and the menu do not appear. (I was surprised
that the problem exists in FF as well as IE). It has been a while
since I worked in CSS. The page can be seen at www.lifeonwheels.com/
beta/. Help pointing me in the right direction will be much
appreciated. The relevant CSS, is as follows:
/* CSS Document */
/*WRAPPER - encloses entire page*/
#pagewrapper {
position:relative;
min-width:600px;
max-width:910px;
width:100%;
margin-left:auto;
margin-right:auto;
margin-top:0;
text-align:left;
}
/*logo positioning*/
img#logo {
position:absolute;
top:3px;
z-index:10;
}
/*page heading*/
#header {
position:relative;
height:149px;
background-image:url(../images/banner.jpg);
background-repeat:no-repeat;
z-index:5;
left:-2px;
}
/*topmenu - ul menu in heading*/
#header ul {
position:relative;
font-size:90%;
font-weight:bold;
top:131px;
left:135px;
padding:0;
z-index:15;
}
#header li {
display:inline;
padding:0 8px;
}
__
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] Help With Form Submission Response
My request for help may be beyond the scope of this list, but I thought I would post it and see if anyone could help. I have a form, which submits to a file on the server. I've been told that once the server file receives a submission, it can send a response to the user stating that the form has been received - but I have no idea how to do that. I do have access to the file. Looking at the code for the file that receives the submission (listed below), it appears that it already has some messages that should be sent, but if I submitt the form without any inputs, I do not get a message from the server. The url for the form submission page is: www.housecallcs.com/pages/virus.htm. Thanks for any help % Dim landing_page, host_url Dim fso, outfile, filename, dirname, myFolder Dim req_method, key, value Dim bErr, errStr, bEmpty On Error resume next bErr = false bEmpty = true errStr = Set fso = Server.CreateObject(Scripting.FileSystemObject) host_url = Request.ServerVariables(HTTP_HOST) req_method = Request.ServerVariables(REQUEST_METHOD) dtNow = Now() filename = Server.MapPath(ssfm) dirname = filename filename = filename /gdform_ DatePart(M, dtNow) DatePart (D, dtNow) DatePart(, dtNow) DatePart(N, dtNow) DatePart(S, dtNow) Function FormatVariableLine(byval var_name, byVal var_value) Dim tmpStr tmpStr = tmpStr GDFORM_VARIABLE NAME= var_name START vbCRLF tmpStr = tmpStr var_value vbCRLF tmpStr = tmpStr GDFORM_VARIABLE NAME= var_name END FormatVariableLine = tmpStr end function Sub OutputLine(byVal line) outfile.WriteLine(line) end sub if err.number = 0 then Set outfile = fso.CreateTextFile(filename, true, false) if err.number 0 then bErr = true errStr = Error creating file! Directory may not be writable or may not exist.brUnable to process request. else if(req_method = GET) then for each Item in request.QueryString if item then bEmpty = false key = item value = Request.QueryString(item) if(lcase(key) = redirect) then landing_page = value else line = FormatVariableLine(key, value) Call OutputLine(line) end if end if next elseif (req_method = POST) then for each Item in request.form if item then bEmpty = false key = item value = Request.form(item) if(lcase(key) = redirect) then landing_page = value else line = FormatVariableLine(key, value) Call OutputLine(line) end if end if next end if outfile.close end if if(bEmpty = true) AND errStr = then bErr = true errStr = errStr brNo variables sent to form! Unable to process request. end if if(bErr = false) then if (landing_page ) then response.Redirect http://; host_url / landing_page else response.Redirect http://; host_url end if else Response.Write errStr end if set fso = nothing else Response.Write An Error Occurred creating mail message. Unable to process form request at this time. end if % __ 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/
[css-d] IE6 Margin Problem
This is the link to a page that has a margin problem in IE6/Win -
http://www.housecallcs.com/newWeb/pages/archive/termarchive.htm
There are four columns of dates - (The dates are hidden until they
are needed. I only have the first date in each column showing for
test purposes). The columns are contained in a div contentarea and
are floating columns. I am using the clearfix clearing method in the
css code. The css for the columns is:
#contentarea {
margin-left:50px;
position: relative;
}
#contentarea .column {
float:left;
margin-left:50px;
}
#contentarea .on {
visibility:visible;
}
#contentarea .off {
visibility:hidden;
}
In IE6/Win the first several letters of each column are not showing.
In all other browsers, the text shows correctly.
Help is much appreciated. Please copy replies to me, as I am on
digest. Thanks, Linda
__
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/
[css-d] Thanks for help
Just wanted to say thank-you for this list. The answer I received from Georgon post help with disappearing borders in IE6/Win was exactly the answer I needed. My borders are now appearing nicely. I'm sure I will have more questions as I go along, and it is good to know you are all here! Linda __ 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/
[css-d] help with disappearing borders in IE6/Win
Hello to everyone. I am new to this list - just found out about it
today while doing some research on css problems. Thought I would give
asking for help here a try.
I am building a site and on several pages I am using top and bottom
borders to highlight section headings. All is well on Netscape FF
(Win) and Safari, FF, Netscape Opera (Mac). However, in IE6/Win the
borders do not appear. A link to one of the pages is:
http://www.housecallcs.com/newWeb/pages/services.htm
the same problem occurs on the About Us page. The home page uses the
borders, but they show up. The only difference between the two
heading, is that on the Services About Us page, I use a negative
text-indent a first-child, neither of which are used on the home
page. The CSS that includes the border, negative text indent, and
first-letter sizing is:
#holder h3 {
margin-top:10px;
font-size:1.125em;
text-indent:-0.9em;
color:#993233;
letter-spacing:.25em;
border-top:3px double #245397;
border-bottom:3px double #245397;
}
#holder h3:first-letter {
font-size:1.25em;
}
Any ideas on how I can get the borders to show in IE6? Can I change
the CSS, or do I need a hack?
BTW, my XHTML and CSS validate (I do have a question on that, but I
will wait on it).
Thanks for any help you can give me.
__
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/
