Jump to content

Wolverine

Members
  • Posts

    55
  • Joined

  • Last visited

Posts posted by Wolverine

  1. That is no CSS I have ever seen, that said the CSS in the tutorial looks like this: <!DOCTYPE html><html><head><style>form { display: block; margin-top: 0em;}</style></head><body><p>A form element is displayed like this:</p><form action="demo_form.asp">First name: <input type="text" name="FirstName" value="Mickey"><br>Last name: <input type="text" name="LastName" value="Mouse"><br><input type="submit" value="Submit"></form><p>Change the default CSS settings to see the effect.</p></body></html>

  2. Here are the results I got when I tried to fix it in the Validator:Info: The Content-Type was text/html. Using the HTML parser.Info: Using the schema for HTML with SVG 1.1, MathML 3.0, RDFa 1.1, and ITS 2.0 support.Error: Start tag form seen in table.From line 26, column 8; to line 27, column 813>↩<table>↩<form method="post" action="mailto:miloshman2004@yahoo.com" enctype="text/plain">↩<tr>↩Error: Element form not allowed as child of element table in this context. (Suppressing further errors from this subtree.)From line 26, column 8; to line 27, column 813>↩<table>↩<form method="post" action="mailto:miloshman2004@yahoo.com" enctype="text/plain">↩<tr>↩Contexts in which element form may be used:Where flow content is expected.Content model for element table:In this order: optionally a caption element, followed by zero or more colgroup elements, followed optionally by a thead element, followed optionally by a tfoot element, followed by either zero or more tbody elements or one or more tr elements, followed optionally by a tfoot element (but there can only be one tfoot element child in total), optionally intermixed with one or more script-supporting elements.Error: Start tag textarea seen in table.From line 65, column 5; to line 65, column 49</tr>↩<tr><textarea name="comments" rows="5" cols="60"></textFatal Error: Cannot recover after last error. Any further errors will be ignored.From line 65, column 5; to line 65, column 49</tr>↩<tr><textarea name="comments" rows="5" cols="60"></textDocument checking completed.Source<!DOCTYPE HTML>↩<html>↩<head>↩<title>Sign-up for e-mail specials</title>↩<style>↩#header {background-image: url(greenleaves.jpg); padding: 10px; color: white}↩</style>↩</head>↩<body>↩<div id="header">↩<h1 class="pagetitle">The Garden Company</h1>↩<h5 class="tagline"><i>Helping your garden grow since 1975</i></h5>↩</div>↩<nav>↩<hr>↩<p style="font-family: Arial, Helvetica, sans-serif; color: black; font-style: normal; margin:0px">↩<a class="buttonlink" href="index.htm"><img src="button.jpg" alt="">Home</a>↩<a href="tips.htm"><img src="button.jpg" style="border:none" alt=""></a>↩<a href="problems.htm"><img src="button.jpg" style="border:none" alt=""></a>↩<a href="products.htm"><img src="button.jpg" style="border:none" alt=""></a>↩<a href="about.htm"><img src="button.jpg" style="border:none" alt=""></a>↩<a href="contact.htm"><img src="button.jpg" style="border:none" alt=""></a></p>↩<hr>↩</nav>↩<h3 style="font-style:normal">Sign-up for E-mail Specials</h3>↩<table>↩<form method="post" action="mailto:miloshman2004@yahoo.com" enctype="text/plain">↩<tr>↩<td>Name</td>↩<td><input type="text" name="Name" size="30" maxlength="50" required></td>↩<tr>↩<td>E-mail address</td>↩<td><input type="email" name="E-mail address"></td>↩</tr>↩<tr>↩<td>State:</td>↩<td>↩<select name="state">↩<optgroup label="Europe">↩<option>Spain</option>↩<option>Slovakia</option>↩<option>France</option>↩</optgroup>↩<optgroup label="America">↩<option>SAD</option>↩<option>Canada</option>↩</optgroup>↩</select>↩</td>↩</tr>↩<tr>↩<td>Level of gardening expertise:</td>↩<td>↩↩<input type="radio" name="level" value="Beginner">Beginner<br>↩<input type="radio" name="level" value="Intermediate">Intermediate<br>↩<input type="radio" name="level" value="Expert">Expert<br>↩<input type="radio" name="level" value="Pro">Professional<br>↩</td>↩</tr>↩<tr>↩<td></td>↩<td><input type="checkbox" name="partner" value="Yes" checked="checked">Yes, I would also like to receive coupons and offers from other gardening-related companies.</td>↩</tr>↩<tr><textarea name="comments" rows="5" cols="60"></textarea></tr>↩<tr><input type="submit">↩<input type="reset" value="clear"></tr>↩</form>↩</table>↩<hr>↩<p class="copyright">Copyright ©2012 The Garden ™<br>↩No material may be reproduced without written permission<br>↩<a href="mailto:webmaster@contoso.com?subject=Question/Comment" title="webmaster@contoso.com" style="color: black; text-decoration:none">Contact the <del>Webmaster</del><b>Master Gardener<b></a></p>↩</body>↩</html>

    I do not know enough HTML or CSS to fix the remaining errors, sorry about that.

  3. There is no need to put a semi-colon for one CSS declaration. The semi-colon is a separator, not a terminator, so it's only needed to separate statements if you have more than one.

     

    The unclosed <img> tag is clearly the reason of the styles leaking onto the rest of the page.

    I am still learning and thus said, "my personal opinion only".

  4. a few things that I think might help but are my opinion only, on these lines it might help if you closed the img tage:

    1. [*]<a class="buttonlink" href="index.htm"><img src="button.jpg" alt="">Home</a>↩ [*]<a href="tips.htm"><img src="button.jpg" style="border:none"></a>↩ [*]<a href="problems.htm"><img src="button.jpg" style="border:none"></a>↩ [*]<a href="products.htm"><img src="button.jpg" style="border:none"></a>↩ [*]<a href="about.htm"><img src="button.jpg"style="border:none"</a>↩ [*]<a href="contact.htm"><img src="button.jpg"style="border:none"</a></p>

    and it might help if you put a semicolon to the right of the word none. But that is my personal opinion only.

    • Like 1
  5. I used some CSS code which worked internally on my website. When I went to convert the code to an external .css file but ran into some issues. I can use the internal version, but the external is more efficient and less restrictive. Here is the code for the internal HTML code with CSS:

    <!DOCTYPE html><html>    <head>        <style type="text/css">            html             {            background: url("resources/images/docTech25Banner.png")             no-repeat center center fixed;             -webkit-background-size: cover;            -moz-background-size: cover;             -o-background-size: cover;             background-size: cover;            }             ul            {            list-style-type: none;            margin: 0;            padding: 0;            overflow: hidden;            }            .dropdown-menu {            padding: 0;            margin: 0;            width: 130px;            font-family: Arial;            display: block;            border: solid 1px #CCCCCC;            border-bottom-style: none;            background-color: #F4F4F4;            }            .dropdown-menu .menu-item-link {            display: block;            border-bottom: solid 1px #CCCCCC;            text-decoration: none;            line-height: 30px; /* Vertically center the text */            color: rgba(89,87,87,0.9);            height: 30px;            padding: 5px;            cursor: pointer;            }            .dropdown-menu .menu-item {            display: none;            }            .dropdown-menu .menu-item.active {            display: block;            }            .dropdown-menu:hover .menu-item {            display: block;            }            .dropdown-menu .menu-item-link:hover {            background-color: #DDDDDD;            }            .dropdown-menu .menu-item.active .menu-item-link:after {            width: 0;             height: 0;             content: "";            position: absolute;            top: 18px;            right: 8px;            border-top: 4px solid rgba(0, 0, 0, 1);                 border-left: 4px solid transparent;            border-right: 4px solid transparent;            }        </style>        <title>DocTech25 Universe</title>    </head>    <body>        <ul class="dropdown-menu">            <li class = "menu-item active">                 <a class="menu-item-link" href = "">Navigation</a>            </li>            <li class= "menu-item">                <a class="menu-item-link" href = "#">Home</a>            </li>            <li class="menu-item">                <a class = "menu-item-link" href = "#">                    Entertainment</a            </li>            <li class="menu-item">            <a class = "menu-item-link" href = "#">University</a></li>            <li class="menu-item">                <a class = "menu-item-link" href = "#">Labs</a>            </li>        </ul>    </body></html>
    This works just fine, however I would like the CSS as external code. Here is my attempt at doing so (Please note that I am only tackling the image at this time and not the navigation, if you would like to help with that, it would be greatly appreciated, but for right now the main focus is the image.): HTML
    <!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <style type="text/css">            .dropdown-menu {            padding: 0;            margin: 0;            width: 130px;            font-family: Arial;            display: block;            border: solid 1px #CCCCCC;            border-bottom-style: none;            background-color: #F4F4F4;            }            .dropdown-menu .menu-item-link {            display: block;            border-bottom: solid 1px #CCCCCC;            text-decoration: none;            line-height: 30px; /* Vertically center the text */            color: rgba(89,87,87,0.9);            height: 30px;            padding: 5px;            cursor: pointer;            }            .dropdown-menu .menu-item {            display: none;            }            .dropdown-menu .menu-item.active {            display: block;            }            .dropdown-menu:hover .menu-item {            display: block;            }            .dropdown-menu .menu-item-link:hover {            background-color: #DDDDDD;            }            .dropdown-menu .menu-item.active .menu-item-link:after {            width: 0;             height: 0;             content: "";            position: absolute;            top: 18px;            right: 8px;            border-top: 4px solid rgba(0, 0, 0, 1);                 border-left: 4px solid transparent;            border-right: 4px solid transparent;            }        </style>        <title>DocTech25 Universe</title>        <link rel="stylesheet" type="text/css" href="resources/css/docTech25Banner.css" />    </head>    <body>        <ul class="dropdown-menu">            <li class = "menu-item active">                 <a class="menu-item-link" href = "">Navigation</a>            </li>            <li class= "menu-item">                <a class="menu-item-link" href = "#">Home</a>            </li>            <li class="menu-item">                <a class = "menu-item-link" href = "#">Entertainment</a>            </li>            <li class="menu-item">                <a class = "menu-item-link" href = "#">University</a>            </li>            <li class="menu-item">                <a class = "menu-item-link" href = "#">Labs</a>            </li>        </ul>    </body></html>
    CSS (resources/css/docTech25Banner.css)
    html {/* Uses "docTech25Banner.png" from resource directory background */try this:body {    background-image: url("resources/images/docTech25Banner.png");}/*background: url("resources/images/docTech25Banner.png")*/ /* Does not repeat and is fixed at center width and height */no-repeat center center fixed;  /* Provides compatibility in Internet Explorer, Chrome, Firefox,  * Safari, and Opera browsers for web browser rendering engine */-webkit-background-size: cover; /* Safari & Chrome */-moz-background-size: cover; /* Firefox */-o-background-size: cover; /* Opera */background-size: cover; /* Internet Explorer? *//* The above from centered background to browser compatibility is * contributed to this site: * https://css-tricks.com/perfect-full-page-background-image/ */} ul{/* Specifies the appearance of a list item element */ list-style-type: none;/* Sets margins */margin: 0;/* Sets padding */padding: 0;/*  specifies whether to clip content, render scroll bars or * just display content when it overflows its block level container */overflow: hidden;}
  6. Here is the valid html:<!DOCTYPE html><html><head><title>myTitle</title><meta charset="UTF-8" lang="nb"><link rel="stylesheet" type="text/css" href="style2.css"><script type="text/javascript" src="jquery"></script><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script><script type="text/javascript" src="script2.js"></script></head><body><!-- <div id="container"> --><div id="t-section"><h1>myHeading</h1><p>t-section<p></div><div id="nav"> <!--Navigation bar--><ul><li>nav-section</li><li>item1</li><li>item2</li><li>item3</li><li>item4</li></ul><ul style="text-align:right"><li>item5</li><li>item6</li></ul></div><div id= "l-section"> <!--Left navigation bar/ section--><ul><li>l-section</li><li id="heading">heading1</li><li>item1</li><li>item2</li><li>item3</li><li>item4</li><li>item5</li><li>item6</li><li class="heading">heading2</li><li>alphabetic navigation</li><li class="heading">heading3</li><li>item1</li><li>item2</li><li>item3</li></ul></div><div id= "r-section"> <!--Right section--><br><p><em>r-section</em><p>Something something something</p></div><div id="aticle"> <!--Main section at center of screen--><p><em>main-section</em></p><p>Text text text text</p></div><div id="footer"> <!--Footer at bottom of page--><ul><li>footer-section</li><li>info1</li><li>info2</li><li>info3</li></ul></div><!--</div>--></body></html>

  7. One of the errors that the validator shows is more than one occurence of ID NAVMENUITEM.

     

    The id Selector

    The id selector uses the id attribute of an HTML tag to find the specific element.

    An id should be unique within a page, so you should use the id selector when you want to find a single, unique element.

    To find an element with a specific id, write a hash character, followed by the id of the element.

     

    use a CLASS instead.

  8. You could try the HTML FOOTER TAG:

    Definition and Usage The <footer> tag defines a footer for a document or section. A <footer> element should contain information about its containing element. A <footer> element typically contains: • authorship information•copyright information•contact information•sitemap•back to top links•related documents You can have several <footer> elements in one document.
  9. Because W3C defined at:

    Definition and Usage

    The <base> tag specifies the base URL/target for all relative URLs in a document.

    There can be at maximum one <base> element in a document, and it must be inside the <head> element.

    It is not meant for making Indexes with.
  10. Well according to the w3c validator:Validation Output: 3 Errors

    • [*]error.png
    Line 2, Column 35: Attribute xmlns:og not allowed here.<html xmlns:og="http://ogp.me/ns#">[*]warning.pngLine 2, Column 35: Attribute with the local name xmlns:og is not serializable as XML 1.0.<html xmlns:og="http://ogp.me/ns#">[*]error.pngLine 6, Column 64: Bad value title for attribute name on element meta: Keyword title is not registered.<meta name="title" property="og:title" content="Sample Title" />Syntax of metadata name:A metadata name listed in the HTML specification or listed in the WHATWG wiki. You can register metadata names on the WHATWG wiki yourself. [*]error.pngLine 8, Column 302: Bad value image for attribute name on element meta: Keyword image is not registered.…SlaHgOb0zmJoVaIURenAHffRuupC4qC0yZ0BDe54LdFPEmracDkoMviXxV/" /><!--main.html-->Syntax of metadata name:A metadata name listed in the HTML specification or listed in the WHATWG wiki. You can register metadata names on the WHATWG wiki yourself.

    what it should look like is:

    <!DOCTYPE html><html><head><title>My site</title><meta http-equiv="content-type" content="text/html; charset=UTF-8"/><meta property="description" content="Sample description"><!--main.html--></head><body>content<img src="http://yourshot.nationalgeographic.com/u/fQYSUbVfts-T7pS2VP2wnKyN8wxywmXtY0-Fwsgxpi9nxv4XgGwfeKJsnYs5NUij4X_IUIoAtrPnX5kIWmikYF2fp9MR1wTT8DH1JuGe8-qJ4ViHJFrUagMIMF1Fwhe5fbvmiGNAeW2Xike1jpziMjSlaHgOb0zmJoVaIURenAHffRuupC4qC0yZ0BDe54LdFPEmracDkoMviXxV/" alt="" ></body></html>

  11. Would someone please help. I kept my code very simple as I am new at HTML. The below code works and all I want to do is replace the hard coded value "Heading" in "<h1>Heading</h1" by using the value in the text variable "var HeadingText" which is "Auto Manufacturing Company". Also, do the same, replace the hard coded value "Description" in "<p>Description"</p>" by using the value in the text variable "var CollapsibleText" which is "Ford". In other words, instead of using hard coded values, use text associated with a variable as follows "<h1>use value associated with var HeadingText </h1>" giving "<h1>Auto Manufacturing Company</h1>. Thank you.

    Edward

    enpiccoli@msn.com

    myapp.Main.CurrentEvents_selectedItem_postRender = function (element, contentItem) {var HeadingText = "Auto Manufacturing Company"var CollapsibleText = "Ford"var helpText = $("<div data-role='collapsible' data-theme='a' data-content-theme='a'>" + "<h1>Heading</h1>" +"<p>Description</p>" +" </div>");helpText.prependTo($(element));};

    What language are you used to coding in? It sure is not HTML

  12. Does your <meta> look like:

    <code>

    <meta name="description" content="Free Web tutorials"><meta name="keywords" content="HTML,CSS,XML,JavaScript">

    </code>

    But with 'proprietary' description and keyword attributes. If so then I do not see a problem. Now a <meta> that does not look like one of the above may cause problems with the validaror.

  13. It is a contact form on my Index.html that was originally developed when I was on another ISP by someone who was doing a FREE PERSONAL WEBSITE SPECIAL to get customers. I think they are out of Business now as I can't find them anymore. I have managed to convert everything else over to HTML5 and CSS but this is where I am stuck. You asked and I quote"Align a Table what does that mean?" I am giving an example of what that means. Here is the html code for my index page and the url as well:

    <!DOCTYPE html><html><head><link href="marksplace.css" rel="stylesheet" /><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta name="description" content="My personal Homepage and Interests"><meta name="keywords" content="Personal Homepage,Sci-fi,NEVERWINTER NIGHTS,Civil War,science fiction"><style>table,td,th{border:5px solid transparent;text-align:center;}td{height:50px;vertical-align:top;}body{background-image:url('starback.jpg'); }img { border: 0; }body{background-color:black; color:white; line-height:200%;}</style><title>Mark's Place</title><!-- this document was created by Phoenix Productions --></head><img src="markpl.jpg" width="199" height="198" alt=""><h1 style="text-align:center; color:gold;">Introduction</h1><ul><li style="list-style-type:none;"> Hi, my name is Mark Nelson and I am a Trekker, I am interested in Star Trek, Star Wars, Science Fiction Books, Movies and TV Shows, and NEVERWINTER NIGHTS . If you are a Trekker please come here and let's stay in touch.<p> </p></li></ul><!--<center><b><font size="+2">Hobbies and Interests</font></b></center>--><h2 style="text-align:center;">Hobbies and Interests</h2><p>My Hobbies are computers, reading Science Fiction Books, playing NEVERWINTER NIGHTS and the Internet. I hope all the fans of StarTrek and NEVERWINTER NIGHTS will come here and tell me how they like mysite. Livelong and Prosper!</p><h3>CATS</h3><p>I bought a cat back in October of last year. She is cute, frisky and a very active cat.</p><p><img style="float:right;" src="ncc1701d.jpg" alt="Starship Enterprise NCC1701D"> </p><!--<center></center> <center> </center>--> <a style="color:yellow;" href="http://home.comcast.net/%7Em.nelson10/page2.htm">page2.htm</a>  <center><table> <!--border="5"--><tbody><tr><td><font size="+2"><script type="text/javascript">//<!--var Domain = "comcast.net"var Mailme = "mail" + "to:" + "m.nelson10@" + Domaindocument.write("<FORM>");document.write("<INPUT TYPE="submit" VALUE="Send me some email" ");document.write("onClick="parent.location=Mailme"> ");document.write("<FORM>");// --></script></font><form><font size="+2"><input value="Send me some email" onclick="parent.location=Mailme" type="submit"> <a>Mark's E-Mail</a> </font></form></td></tr></tbody></table></center><img src="counter.png" alt="counter.png"><!--<center><i>This page was created by Phoenix Productions, Inc.</i></center><center><i>Phoenix Productions, Inc. © 1996.</i></center>--><!-- This shows the user the last date this page was modified --><center></center><br><br></body></html>
  14. I think he is having the same problem that I am. On the index page of my home page I have a table with some javascript for sending me email. The code looks like this:

    <code>

    <

     

    center>

    <

     

    table> <!--border="5"-->

     

    <tbody>

     

    <tr>

     

    <td>

     

    <font size="+2">

     

    <script type="text/javascript">

    <!--

    //

     

    var Domain = "*******.net"

     

    var Mailme = "mail" + "to:" + "*.********@" + Domain

    document.write(

    "<FORM>");

    document.write(

    "<INPUT TYPE="submit" VALUE="Send me some email" ");

    document.write(

    "onClick="parent.location=Mailme"> ");

    document.write(

    "<FORM>");

     

    // -->

     

    </script></font><form><font size="+2"><input value="Send me some email" onclick="parent.location=Mailme" type="submit"> <a>Mark's

    E-Mail

    </a> </font></form>

     

    </td>

     

    </tr>

     

    </tbody>

    </

     

    table>

    </

     

    center>

    </code>

    Now how to align it with CSS and get rid of the CENTER tags is my question.

  15. Hi, I have been having some problem with transform and animations. The css codes are working with a svg image. Everything is working fine in Firefox, but transform does not work in IE11, transition animation does not work in Chrome, and everything falls apart in Mac OS X browsers.

    I'm new at this and don't know where the problem is, please can anyone help me? Thank You.

     

    These are the codes:

    [id$=group] {

    -webkit-transition: -webkit-transform 0.5s ease-in-out, opacity 0.5s ease-in-out;

    -moz-transition: -moz-transform 0.5s ease-in-out, opacity 0.5s ease-in-out;

    -o-transition: -o-transform 0.5s ease-in-out, opacity 0.5s ease-in-out;

    transition: transform 0.5s ease-in-out, opcaity 0.5s ease-in-out; }

     

    [id$=group] {

    opacity: 0;

    -webkit-transform: scale(0.35,0.35);

    -moz-transform: scale(0.35,0.35);

    -ms-transform: scale(0.35,0.35);

    -o-transform: scale(0.35,0.35);

    transform: scale(0.35,0.35); }

     

    [id$=group]:hover {

    opacity: 1;

    -webkit-transform: scale(1,1);

    -moz-transform: scale(1,1);

    -ms-transform: scale(1,1);

    -o-transform: scale(1,1);

    transform: scale(1,1); }

     

    @-webkit-keyframes translateX {

    0% {transform: translateX(250px);

    opacity: 0; }

    100% {opacity: 1;}

    100% {tranform: translateX(0px);}

     

    #title_type {

    -webkit-animation: translateX 3s;

    -moz-animation: translateX 3s;

    animation: translateX 3s; }

     

     

     

     

     

    Hi, I have been having some problem with transform and animations. The css codes are working with a svg image. Everything is working fine in Firefox, but transform does not work in IE11, transition animation does not work in Chrome, and everything falls apart in Mac OS X browsers.

    I'm new at this and don't know where the problem is, please can anyone help me? Thank You.

     

    These are the codes:

    [id$=group] {

    -webkit-transition: -webkit-transform 0.5s ease-in-out, opacity 0.5s ease-in-out;

    -moz-transition: -moz-transform 0.5s ease-in-out, opacity 0.5s ease-in-out;

    -o-transition: -o-transform 0.5s ease-in-out, opacity 0.5s ease-in-out;

    transition: transform 0.5s ease-in-out, opcaity 0.5s ease-in-out; }

     

    [id$=group] {

    opacity: 0;

    -webkit-transform: scale(0.35,0.35);

    -moz-transform: scale(0.35,0.35);

    -ms-transform: scale(0.35,0.35);

    -o-transform: scale(0.35,0.35);

    transform: scale(0.35,0.35); }

     

    [id$=group]:hover {

    opacity: 1;

    -webkit-transform: scale(1,1);

    -moz-transform: scale(1,1);

    -ms-transform: scale(1,1);

    -o-transform: scale(1,1);

    transform: scale(1,1); }

     

    @-webkit-keyframes translateX {

    0% {transform: translateX(250px);

    opacity: 0; }

    100% {opacity: 1;}

    100% {tranform: translateX(0px);}

     

    #title_type {

    -webkit-animation: translateX 3s;

    -moz-animation: translateX 3s;

    animation: translateX 3s; }

     

     

     

     

     

     

    Hi, I have been having some problem with transform and animations. The css codes are working with a svg image. Everything is working fine in Firefox, but transform does not work in IE11, transition animation does not work in Chrome, and everything falls apart in Mac OS X browsers.

    I'm new at this and don't know where the problem is, please can anyone help me? Thank You.

     

    These are the codes:

    [id$=group] {

    -webkit-transition: -webkit-transform 0.5s ease-in-out, opacity 0.5s ease-in-out;

    -moz-transition: -moz-transform 0.5s ease-in-out, opacity 0.5s ease-in-out;

    -o-transition: -o-transform 0.5s ease-in-out, opacity 0.5s ease-in-out;

    transition: transform 0.5s ease-in-out, opcaity 0.5s ease-in-out; }

     

    [id$=group] {

    opacity: 0;

    -webkit-transform: scale(0.35,0.35);

    -moz-transform: scale(0.35,0.35);

    -ms-transform: scale(0.35,0.35);

    -o-transform: scale(0.35,0.35);

    transform: scale(0.35,0.35); }

     

    [id$=group]:hover {

    opacity: 1;

    -webkit-transform: scale(1,1);

    -moz-transform: scale(1,1);

    -ms-transform: scale(1,1);

    -o-transform: scale(1,1);

    transform: scale(1,1); }

     

    @-webkit-keyframes translateX {

    0% {transform: translateX(250px);

    opacity: 0; }

    100% {opacity: 1;}

    100% {tranform: translateX(0px);}

     

    #title_type {

    -webkit-animation: translateX 3s;

    -moz-animation: translateX 3s;

    animation: translateX 3s; }

     

     

     

     

    Well if you are using the same ID in three different places that might be part of the problem.

    http://www.w3schools.com/css/css_selectors.aspThe id Selector The id selector uses the id attribute of an HTML tag to find the specific element. An id should be unique within a page, so you should use the id selector when you want to find a single, unique element. To find an element with a specific id, write a hash character, followed by the id of the element.Usually something like styling the A tag is used with a Class instead of an ID which is supposed to be unique.

×
×
  • Create New...