locked
Facebook and Twitter Link alignment RRS feed

  • Question

  • My website http://www.teachanolddognewtricks.com/ has a new Facebook like button and I just added a twitter link. My preference is to have the twitter link on the same line as the FB stuff, but it is below it.  When I view the code, it is highlighted in yellow so I know something is wrong. 

    What should I do to correct it?

    Thank you.


    Tony


    Monday, May 14, 2012 11:51 PM

All replies

  • Read what it says when you hover the mouse over the yellow. ( I'm not going to look at your page until you take the basic steps: EW tells you why it complains.)
    • Edited by KathyW2 Tuesday, May 15, 2012 12:30 AM
    Tuesday, May 15, 2012 12:29 AM
  • And you might want to address (i.e. fix) the 36 errors and one warning found when the page is validated. Trying to troubleshoot a page with that many validation errors is a losing proposition.


    Please remember to "Mark as Answer" the responses that resolved your issue. It is common courtesy to recognize those who have helped you, and it also makes it easier for visitors to find the resolution later.

    Tuesday, May 15, 2012 1:50 AM
  • I was curious by your response and because of a tool I use I decided to look at some other web sites to look for validation errors.  Yahoo had 418 validation errors. 

    As a newbie to CSS, why should I concern myself with 36 errors?  The site was not built with CSS originally.  This forum page has 26 errors.  Thanks in advance.


    Tony

    Tuesday, May 15, 2012 11:28 AM
  • When I went back to look at the page (a dwt page), the yellow highlighting was no longer there.  If I could trouble you to take a look, it would be appreciated.

    http://www.teachanolddognewtricks.com


    Tony

    Tuesday, May 15, 2012 11:35 AM

  • Yeah man, why worry. There will always be some site out there with more errors than yours, so you should be good to go.



    ClarkNK, A.K.A. HomePage Doctor
    HomePageDoctor.com -- Expression Web database tutorials
    Ownertrades.com -- Created with Expression, VWDExress, SQL Express, and ASP.NET
    Arvixe -- My favored web host
    Tuesday, May 15, 2012 12:01 PM
  • Tony,

    Why would you expect them to be in the same line?  They are in different containers, the tweet in an iframe inside a div that is below the facebook object.  Take a look at your structure in Code View.


    • Edited by KathyW2 Tuesday, May 15, 2012 1:50 PM
    Tuesday, May 15, 2012 1:43 PM
  • I did look at the code and I'm confused.  The code itself was created by twitter and FB respectively. What really confuses me is that I don't see a div tag and you state they are in two different containers.  I don't understand this point, what am I missing or not seeing?

    Should I have first inserted a div and then inserted the code(s) in that div?  On that note, do all divs have to be assigned a style or can they just be left alone?

    Thanks for your time.


    Tony

    Tuesday, May 15, 2012 2:03 PM
  • The point about validation errors seems to have escaped you. It makes no difference how many there are. All you need is one of them to be causing you your current problem. A page with 418 errors that aren't doing any harm is better than a page with 3 errors, one of which is critical to your issue.

    I'm not saying that's the problem, but that was what Scott and Kathy meant. Fix errors first, starting at the top of the page (which may clean up some others lower down, in the process).


    Titanic, the movie, as CSS:

    @mixin iceberg {
         float: none;
    }

    #titanic {
         @include iceberg;
    }

    Tuesday, May 15, 2012 2:24 PM
  • Tony,

    The div was not created by FB or Twitter.

    Inside div content-212, your first item is the FB object.

    Following that is a div that contains the rest of your text content in that center column, and inside that div, the first item is your twitter iframe.

    I'm looking at the code of the published page.  If it's not what you see, I can't explain that.

    Also, you have two <html> tags at the top of the page.  There should only be one. You also have no closing </body> or closing </html> tag.

    You do need to fix these fundamental errors in your document structure.

    Tuesday, May 15, 2012 2:40 PM
  • "Also, you have two <html> tags at the top of the page.  There should only be one. "

    Question 1: The Facebook Code Instructions said I had to put that HTML tag up top.  How do you put two? Or should I just take the standard one out?

    ==================

    "You also have no closing </body> or closing </html> tag."

    Question 2: I have no idea where to put these at this point.  How do I determine that?  Is there a tool? Where do I put them?



    Tony

    Tuesday, May 15, 2012 3:45 PM
  • Tony, why would you put a second HTML tag in?  The FB intructions certainly did NOT tell you to do that.

    You must, MUST understand the structure of an HTML document before you take one step more.  Create a new, empty HTML page in EW.  Look in Code View.  Voila.

    Tuesday, May 15, 2012 3:59 PM
  • This is what Facebook requires when they create the code:
    1. Add an XML namespace to the <html> tag of your document. This is necessary for XFBML to work in earlier versions of Internet Explorer.
      <textarea rows="2" spellcheck="false"><html xmlns:fb="http://ogp.me/ns/fb#"></textarea>

    Tony

    Tuesday, May 15, 2012 4:23 PM
  • Tony,

    All I can tell you is that you are absolutely wrong to have two <html> tags in your document.

    The line "Add an XML namespace to the <html> tag of your document." does not say "add a second <html> tag to your document".   I have no idea what the rest is about.  You don't have <textarea> tags in your code.

    If you want someone to comment on facebook instructions, give us a link to what you are reading.



    • Edited by KathyW2 Tuesday, May 15, 2012 5:29 PM
    Tuesday, May 15, 2012 5:28 PM
  • ALL RIGHT! THIS IS OUTRAGEOUS!! I WANT A MODERATOR, ANY MODERATOR, TO EXPLAIN TO ME WHERE THIS POST IS ABUSIVE, AND WHERE AND HOW IT VIOLATES THE  Code of Conduct IN  ANY RESPECT. THERE'S NO NAME-CALLING, NO PROFANITY, NOTHING. WHAT, EXACTLY, IS YOUR DEFINITION OF ABUSE, AND WHAT CRITERIA MUST WE OBSERVE IN OUR POSTS, AND WHAT, SPECIFICALLY, ABOUT THIS POST WAS ABUSIVE? NOTE THAT NO GUIDANCE MAY BE FOUND IN THE APPARENTLY NON-EXISTENT  Code of Conduct. I HAVE NEVER BEFORE PROTESTED HAVING A POST DELETED IN THIS FASHION, BECAUSE THE REASON WAS APPARENT. THIS TIME IT IS NOT, AND I WANT TO KNOW UPON WHAT GROUNDS WE ARE TO BE CENSORED IN THE FUTURE, OR IS IT SIMPLY TO BE AT THE ARBITRARY CAPRICE OF WHICHEVER MODERATOR HANDLES THE ABUSE TAG?

    <Edited by moderator to remove content previously deleted from forum.>

    EW is NOT a WYSIWYG application, despite your opinion to the contrary.

    You CANNOT work with EW as if it were FrontPage.

    You MUST learn HTML and CSS, yourself, in order to use EW effectively. This is  NOT an option. See the  Prerequisites for Using Microsoft Expression Web.

    You should begin with the w3schools courses at   http://w3schools.com/html/ and http://w3schools.com/css/, which can be worked concurrently or consecutively, your choice. These are self-paced, bite-size lessons that will give you the fundamental understanding that you are so sorely lacking.

    After that, move on and download Cheryl's excellent "Build a Basic Web Site" video tutorial, at http://by-expression.com/post/2009/09/22/Basic-Website-Tutorial.aspx, along with the zip file containing the assets used in the tutorial. Watch the tutorial all the way through, then open the assets file and work your way through the tutorial yourself.

    At that point you will be well-equipped to tackle any static site project you want to undertake. You'll even know enough to make courses to offer on your site which are of actual value to those who view them<REMOVED BY MODERATOR>. You could put them in that section that now says, "Expression Web — Coming Soon!"

    cheers,
    scott


    Please remember to "Mark as Answer" the responses that resolved your issue. It is common courtesy to recognize those who have helped you, and it also makes it easier for visitors to find the resolution later.


    Wednesday, May 16, 2012 6:00 PM
  • And I'm more than a little annoyed that my response per your removed post, a reponse which was absolutely polite, accurate, related to the facts of web design and EW's not being WYSIWYG, was also removed.  I have no idea if it was marked abusive or not, but is absolutely was NOT.
    Wednesday, May 16, 2012 8:09 PM
  • Hi Kathy,

    I did not mark your reply as abusive and something I put was also removed.  Just for the record, I don't want to waste another second on this matter, I was simply asking a question.

    My website http://www.teachanolddognewtricks.com/ has a new Facebook like button and I just added a twitter link. My preference is to have the twitter link on the same line as the FB stuff, but it is below it.  When I view the code, it is highlighted in yellow so I know something is wrong. 

    What should I do to correct it?

    Thank you.


    Tony


    • Edited by Tony Boston Wednesday, May 16, 2012 9:55 PM
    Wednesday, May 16, 2012 9:52 PM
  • I have already replied as to why they are not in the same line, and you have not changed it.  You have not given them any reason to be on the same line: You still have them in different divs, one below the other.  You are putting them in different containers, containers that are not (and should not be, give that the second div has all your main center column content) beside each other.

    You're not trying to float them beside each other, or providing any other reason for the browser to display them on one line.

    ...And you still have two <html> tags and no closing </body> and </html> tags.

    Thursday, May 17, 2012 1:05 AM
  • Sorry Kathy,

    I put the original question there just as a reminder of the original question, not because I was looking for an answer.  Sorry about that.


    Tony

    Thursday, May 17, 2012 11:08 AM
  • Scott,

    I removed your post because it was an attack on Tony, plain and simple. Of course there is some subjectivity to such things, but I think it's pretty clear that the tone and intent of the post is not within our guidelines. We explicitly reserve the right to remove any post that is not respectful of others, and your post falls within that bucket.

    Scott, I certainly agree with the underlying message of your post, but it's important that we all respect each other and not cross that line. As I said, the line is drawn subjectively. Sometimes we may disagree on what is and isn't disprespectful, and in those cases, Microsoft judgement prevails.

    Kathy, I always remove posts that are responses to posts that I delete if the context of those posts isn't in context due to the deletion.

    I hope that helps to explain things. If you'd like to discuss (and I'm certainly open to it), you know where to find me. :)


    Jim Cheshire -- Microsoft

    Friday, May 18, 2012 12:27 AM
    Moderator
  • Thank You.

    Tony

    Friday, May 18, 2012 6:43 PM