www.webdeveloper.com
Results 1 to 4 of 4

Thread: Multiple divs in sameline

  1. #1
    Join Date
    Jun 2009
    Posts
    3

    Post Multiple divs in sameline

    Hi, i need to delvelop something like "SomeName X". On click of 'X' the SomeName will be deleted from the display. Currently i am doing with DIV(1 DIV for 'SomeName' and 1 DIV for 'X' and finally float-left to another DIV). Since these names(like "Somename1 X",'Somename2 X"...) are populated in the div container, when it reaches the right end of the container, "X" alone getting wrapped to the next line. But it has to stick with 'SomeName' always. As other forums says, I tried with table but it didn't work since the final div container is fixed and i get multiple names with variant length. I tried clear:both, float left, inline options - it too didn't work. I have seen like the one in Facebook - Compose New Message page, when typing in "To" field. I would like to know how to implement this. Any help appreciated. Thanks in advance.

  2. #2
    Join Date
    Dec 2008
    Posts
    79
    post the code you have

  3. #3
    Join Date
    Jun 2009
    Posts
    3
    Code here:
    function displayNames(obj, params, teamVar) {
    ....
    obj.style.display = 'block';
    var nameLink = document.createElement("A");
    var mainContainer = document.createElement("DIV");
    mainContainer.setAttribute("class","namesBg");
    mainContainer.className = "namesBg";
    nameLink.setAttribute("href","JavaScript:");
    nameLink.setAttribute("id",params[2][1]);
    nameLink.setAttribute("field",hiddenField);
    nameLink.attachEvent("onfocus", function () {checkkey(event,assVar)});
    nameLink.attachEvent("onblur", function () {checkkey(event,assVar)});
    nameLink.attachEvent("onmouseover", closeOver);
    nameLink.attachEvent("onmouseout", closeOver);
    var linkval = document.createTextNode(params[2][0]);
    var sep = document.createTextNode("|");
    var deleteBtn = document.createElement("DIV");
    deleteBtn.setAttribute("class", "deleteBtn");
    deleteBtn.setAttribute("id", params[2][1]);
    deleteBtn.setAttribute("title", "Delete");
    deleteBtn.setAttribute("field", hiddenField);
    deleteBtn.className = "deleteBtn";
    deleteBtn.attachEvent("onclick", function () {deleteName(assVar)})
    deleteBtn.attachEvent("onmouseover", closeOver);
    deleteBtn.attachEvent("onmouseout", closeOver);
    var btnTxt = document.createTextNode("X");
    nameLink.appendChild(linkval);
    deleteBtn.appendChild(btnTxt);
    mainContainer.appendChild(nameLink);
    mainContainer.appendChild(deleteBtn);
    obj.appendChild(mainContainer);
    }

  4. #4
    Join Date
    Dec 2008
    Posts
    79
    you can put Somename X inside a div, then when it reaches the right end it will stick together.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles