Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jun 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Post Multiple div on same line

    Iam delveloping something like "SomeName X". Onclick of 'X' the name gets deleted from 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 - it too didn't work. I have seen like the one in Facebook - Compose New Message page in 'To' field. I would be interested knowing how to implement this. Any help appreciated. Thanks in advance.

    This is my coding:
    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);
    }

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,865
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    You'd need to set a style ofdisplay:inline; or a float:right/left; to your divs or any other block level elements to keep them inline.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)


  •  

    Posting Permissions

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