HTML/PHP page div showing margin although margin set to 0 -
i making site , cannot seem configure layout to.
here have:
i trying remove orange space along side links on left. want newsfeed section pushed top under navigation bar.
the section on left says 'posts friends', 'inbox' etc. own div. within div 2 more divs smaller width, 1 containing profile image , 1 containing name of user (reece kenney in case). newsfeed section div separate previous divs.
the div containing left content has been set have no margin cannot figure out why still shows has margin way across page.
here php code:
if (stripos($_server['request_uri'], 'home.php')){ echo "<div id='wrappernoimagenewsfeedleft'><br/> <br/> <div id='smallprofilepicleft'> <a href='$user' id='hyperlink'><img src='$profilepic' height='45' width='37' alt='your profile' title='your profile' /></a> </div> <div id='smallnameleft'> <a href='$user' id='hyperlink'>$firstname $lastname</a> </div> <br/> <br/><br/> <br/>"; echo "<a href='home.php' id='hyperlink' style='font-weight: bold;'>posts friends</a> <br/> <br/> <a href='public_posts.php' id='hyperlink' >posts public</a><br/> <br/> "; echo '<a href="/arrowberry/my_messages.php" id="hyperlink">inbox</a> </div>'; } <div id="wrappernoimage"> /*newsfeed section.... ... ... */ </div> i read may have 'butt' of content problem caused whitespace in code unsure means , parts need 'butt' together, if problem here.
update:
i told php code not needed , need post html code. code thought needed. other html code on page navigation bar post anyway.
<div class='newsfeed'> <h2>your newsfeed:</h2> <a href="home.php" id="hyperlink" style='font-weight: bold;'>posts friends</a> <a href="public_posts.php" id="hyperlink" >posts public</a> </div> <div class="newsfeedpostform"> <form action="home.php" method="post"> <textarea id="newsfeedpost" name="post" rows="5" cols="90"></textarea> <input type="submit" name="send" class="postformsubmit" value="post"> </form> </div> and css:
#wrappernoimage { margin-left: auto; margin-right: auto; height: auto; width: 780px; padding-top: 0px; padding-bottom: 0px; padding-left: 10px; padding-right: 10px; border-left: 1px solid #cad3dc; border-right: 1px solid #cad3dc; } #wrappernoimagenewsfeedleft { height: auto; width: 170px; padding-top: 0px; padding-bottom: 0px; padding-left: 10px; padding-right: 10px; margin: none; } #smallprofilepicleft { float: left; height: auto; width: 50px; margin-right: none; } #smallnameleft { float: left; height: auto; width: 100px; margin-right: 0px; } update 2: none of solutions working me post whole html code appears in browser.
<!doctype html> <html> <head> <title>arrowberry</title> <link rel="stylesheet" href="/arrowberry/css/style.css"/> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"> </script> <script src="js/jquery.color.js"></script> <script src="js/script.js"></script> <script src="js/placeholder-js.js" type="text/javascript"></script> <script src="js/main.js" type="text/javascript"></script> </head> <body> <div class="headermenu"> <div id="wrapper"> <div class="logo"> <img src="/arrowberry/img/logo.png"/> </div> <div class="searchbox"> <form action="search.php" method="get" id="search"> <input type="text" name="q" size="60" placeholder="search ..." /> </form> </div> <div id="menu"> <a href="/arrowberry/home.php">home</a> <a href="/arrowberry/reece55">reece55</a> <a href="/arrowberry/my_messages.php">inbox</a> <a href="/arrowberry/friend_requests.php">friend requests</a> <a href="/arrowberry/my_pokes.php">pokes</a> <a href="/arrowberry/accountsettings.php">settings</a> <a href="/arrowberry/logout.php">log out</a> </div> </div> </div> <div id='wrappernoimagenewsfeedleft'><br/> <br/> <div id='smallprofilepicleft'> <a href='reece55' id='hyperlink'><img src='userdata/profile_pics/od9mj3rirbdyjo4/screen shot 2014-06-02 @ 17.20.38.png' height='45' width='37' alt='your profile' title='your profile' /></a> </div> <div id='smallnameleft'> <a href='reece55' id='hyperlink'>reece kenney</a> </div> <br/> <br/><br/> <br/><a href='home.php' id='hyperlink' style='font-weight: bold;'>posts friends</a> <br/> <br/> <a href='public_posts.php' id='hyperlink' >posts public</a><br/> <br/> <a href="/arrowberry/my_messages.php" id="hyperlink">inbox</a> </div> <div id="wrappernoimage"> <br /> <div class='newsfeed'> <h2>your newsfeed:</h2> <a href="home.php" id="hyperlink" style='font-weight: bold;'>posts friends</a> <a href="public_posts.php" id="hyperlink" >posts public</a> </div> <div class="newsfeedpostform"> <form action="home.php" method="post"> <textarea id="newsfeedpost" name="post" rows="5" cols="90"></textarea> <input type="submit" name="send" class="postformsubmit" value="post"> </form> </div> <div class='bottom'> </div> <script language="javascript"> $(document).ready(function() { var load = 0; $(window).scroll(function() { if($(window).scrolltop() == $(document).height() - $(window).height()) { load++; $.post("friends_newsfeed_ajax.php",{load:load},function(data) { $('.bottom').append(data); }) } }) });
the space referencing not margin in strict sense of word (if was, appear margin when inspect it, screenshot shows no margin on selected element). if orange box dead space, , want #wrappernoimage div display next #wrappernoimagenewsfeedleft div (instead of "below" it), try setting css property:
display: inline; on both #wrappernoimagenewsfeedleft element , #wrappernoimage element.
if not fix issue, please post copy of full html of page displays in browser. have posted might not sufficient thoroughly determine causing line-break after #wrappernoimagenewsfeedleft div.
Comments
Post a Comment