Jump to content

jwcane

Members
  • Posts

    29
  • Joined

  • Last visited

Posts posted by jwcane

  1. OK thanks to all of you, the underline is finally gone. Solution was a hybrid of Foxy's a img + Sacred's 1.a) less the vertical-align statement, as in:

     

    a {
    color: #CCCCCC;
    line-height: 0;
    }
    td > a {
    display: inline=block;
    }
    a img {
    vertical-align: middle;
    }
    a:hover {
    background-color: #d3d3d3;
    color: #000000;
    text-decoration: none;
    }
  2. OK the ohover attribute now reads as follows:

     

    a:hover {
    background-color: #d3d3d3;
    color: #000000;
    vertical-align: middle;
    text-decoration: none;
    Line-height: 0;
    border: none;
    }
    Adding that line makes a barely perceptible change in alignment on hover, image shifting slightly downward, but underlining remains visible.
  3. "Hot graphic" above, refers to an image containing a hyperlink. Pls. excuse loose terminology.

     

    Underscore occurs only on hovering. All of the css code that I am using is in the basic posting. For a running example, please see this page, and hover over any image in main window.

     

    In reply to your earlier reply, there is no white space between code elements, and in any case the underline occurs only on hovering, not in the plain html output.

  4. my css has the following specs for hot graphics:

     

    a {
    color: #CCCCCC;
    border: 0;
    }
    a:hover {
    background-color: #d3d3d3;
    color: #000000;
    text-decoration: none;
    Line-height: 0;
    border: none;
    }
    Would like to know the syntax to defeat the _underscore_ when hovering. Have looked around, and have tried a number of possibilities, without tumbling to the correct one.
    Could one of you please show me the property that controls this behavior.

     

     

     

  5. My css has a background style with non-repeating image, that works fine:
    .HeaderImg1b {
    background-image: url("/photodesign/images/pgHeader-1b.jpg");
    background-repeat:no-repeat;
    }
    To create that image on the fly, the <div style tag is more convenient, as in:
    <div
    style="background: url(/photodesign/images/pgHeader-1b.jpg)>"
    </div>
    This latter code has some error that is preventing the image from being rendered.
    Have also tried adding quotes inside parens with and without the outer set of quotes, and no quotes. Behavior is unchanged.
    Would appreciate an idea of what is wrong.
  6. My form elements are all within table cells. Redundant 'align="left"' commands were added to tables, rows and cell tags, just to be sure of following:
    I'm finding that with <input type="checkbox"...> and <input type="radio button"...>, some unknown setting in my style sheet is centering them, and adding a displacement between those elements and their adjacent text labels. Removing the style sheet reference, removes the error.
    In other cells a <TextArea...> and an <input type= "select"...> are both correctly left-justified, so I'm at a loss to explain why this is happening only to the first two elements.
    Possible css tags in current use, that might bear on this issue, include:
    body{
    /* font, color, etc... */
    text-align:left;
    }
    form {
    /* color, font-size, line-height */
    text-align:left;
    }
    input,
    textarea {
    border:0px; padding: 2px; margin: 8px;
    }
    input {
    width: 150px;
    }
    textarea {
    width: 278px;
    }
    label {
    display: block;
    text-align: left
    }
    Any ideas appreciated.
  7. My html form has its own class with defined font size. Plain text entered within the form (outside a control) looks like it is in some default format not governed by the form class definition. Only solution I have found is to surround each instance with custom-defined tags, i.e., <tx1>...</tx1>.

     

    Please let me know if there is a class definition that will apply to all plain text throughout the form, as an alternative to individual tags (above).

  8. Not sure I understand your question. I am new to these advanced concepts. I am just trying to conform to the sample css and html coding that you have posted in this thread, while adapting that coding to my needs.

  9. Here is revised css content:

     

    .Label,

    .Label.rounded
    {
    color: #F8F4E9 /*Cream*/
    }
    .Label.rounded input,
    .Label.rounded textarea
    {
    border-radius: 5px;
    background-color: #F8F4E9; /*ctlBG, Cream*/
    color: #2F3B2E; /*ctlContent, dkGreen*/
    }
    .Label.rounded input:focus,
    .Label.rounded textarea:focus
    {
    border-radius: 5px;
    background-color: #EAF9E9; /*ctlBG, ltGreen*/
    color: #2F3B2E; /*ctlContent, dkGreen*/
    }
    In html, the following example:
    <label class="rounded">
    First Name:
    <input type="text" name="fname" placeholder="Enter first name">
    </label>
    ...is rendered as expected, with following exceptions/questions:
    -- The leading text, "First Name:", is still being rendered in black, for edit and TextArea controls. One option might be to simply not use any leading text, since the placeholder fills that function.
    -- When it has focus, the control turns to square corners (border-radius=0). Is this standard behavior that cannot be modified?
    -- Can the (default color = blue) focus-box color be modified?
    -- In the case of the TextArea input, if I eliminate the leading text, is there a counterpart to 'PlaceHolder'? Tried to specify 'PlaceHolder' in my TextArea, and it was not rendered
  10. <label class="rounded">Last Name:<input type="text" name="lname" placeholder="Enter last name"></label>

    Have not succeeded with a couple of approaches to formatting the caption text ("Last Name:", in the above example). Can that be done with a css style, or does it require inline formatting?
  11. Could someone show me how to edit/extend the "inputText" class referred to above, to customize the style elements/properties of edit controls, i.e., size, shape, rounded corners, background color, etc., using css alone if ;possible. Coding without recourse to java or other scripting is desirable but not a show-stopper.

  12. Yes, form table but I'm trying to alter the sizes/shapes of form controls, as observed in some web sites. The controls would probably, also reside within a table structure.

  13. Would like to adjust input areas of forms. Would you please point me to instructions for controlling size and shape of input areas such as InputText. I have created the following style for my forms. the border radius property is supposed to place rounded corners in the input box. It does not work. Thanks
    FormTable {
    Align: Center;
    Border: 1;
    border-radius: 10px;
    Cell-spacing: 5px;
    Cell-padding: 15px;
    font-family: Verdana, Arial, sans serif;
    font-size: 2em;
    line-height: 200%;
    margin-left: auto;
    margin-right: auto;
    padding: 5px;
    }
  14. When hovering over a link, browser displays the complete URL at bottom of page.

     

    Please advise the name of the preview window, for purposes of controlling its properties.

×
×
  • Create New...