Start New Discussion Reply to this Discussion css issue
I have this problem specifically on phones and tablets is that the misaligned blue search icon on the top left. Not sure how to fix this.
www.talkjesus.com is where it happens. Works on desktop, but not phone or tablet.
screenshot
http://i48.tinypic.com/a3o1l1.jpg
Related Article: Simple CSS Issue How to use link
is a Web Design, HTML and CSS discussion thread by vishalonne that has 3 replies and was last updated 8 months ago.
LogicWeb
Junior Poster
100 posts since Jan 2008
Reputation Points: 10
Solved Threads: 0
Skill Endorsements: 0
I'm not seeing that page when I view on mobile. The design is totally different on my phone.
Based on the screenshot, however, my assumption would be that the div wrapping the form either needs more width or less padding, or maybe both.
EvolutionFallen
Posting Pro in Training
406 posts since Aug 2009
Reputation Points: 95
Solved Threads: 84
Skill Endorsements: 7
Hi Evo,
You need to click "full site" to view the desktop version.
The html code is:
<div id="top_header">
<div id="globalsearch" class="globalsearch">
<form action="http://www.talkjesus.com/search.php?do=process" method="post" id="navbar_search" class="navbar_search">
<input type="hidden" name="securitytoken" value="1359502826-a71dd9515a376ecb67442ea0d819805025d16ed5">
<input type="hidden" name="do" value="process">
<input type="text" value="" name="query" class="textbox" tabindex="99">
<input type="submit" class="searchbutton" name="submit" onclick="document.getElementById('navbar_search').submit;" tabindex="100">
</form>
</div>
<ul class="advanced_search">
<li><a href="http://www.talkjesus.com/search.php" accesskey="4">Advanced Search</a></li>
</ul>
<div id="toplinks" class="toplinks">
<ul class="isuser">
<li><a rel="nofollow" href="http://www.talkjesus.com/login.php?do=logout&logouthash=" onclick="return log_out('Are you sure you want to log out?')">Log Out</a></li>
<li><a href="http://www.talkjesus.com/usercp.php">Settings</a></li>
<li class="popupmenu nonotifications" id="nonotifications">
<a class="popupctrl" href="http://www.talkjesus.com/usercp.php" id="yui-gen1">Notifications</a>
<ul class="popupbody" id="yui-gen0">
<li id="no-new-message">No new messages</li>
<li><a href="http://www.talkjesus.com/private.php">Inbox</a></li>
</ul>
</li>
<li class="welcomelink">Hi <a href="http://www.talkjesus.com/members/chad.html">Chad</a></li>
<li id="fb_headerbox">
<a onclick="_gaq.push(['_trackEvent', 'Outgoing', 'www.facebook.com', '/profile.php?id=']);" rel="nofollow" id="fb_link" href="http://www.facebook.com/profile.php?id=">
<img id="fb_squarepic" width="16" height="16" alt="The Facebook Platform" src="https://graph.facebook.com/783340042/picture" title="The Facebook Platform">
<img id="fb_icon" width="14" height="14" alt="The Facebook Platform" src="images/metro/blue/misc/facebook.gif" title="The Facebook Platform">
</a>
</li>
</ul>
</div>
</div>
CSS is
#top_header {
height: 36px;
padding-top: 12px;
}
#top_header .globalsearch {
border: solid 1px #e4e4e4;
background-color: #ffffff;
height: 30px;
}
.globalsearch {
width: 254px;
float: left;
text-align: left;
line-height: 1.0em;
}
.navbar_search {
width: 250px;
height: 28px;
padding: 2px;
}
.advanced_search {
float: left;
font-size: 12px;
line-height: 32px;
padding-left: 8px;
}
.toplinks {
color: ;
font: ;
font-size: 14px;
text-align: right;
background: none;
float: right;
}
LogicWeb
Junior Poster
100 posts since Jan 2008
Reputation Points: 10
Solved Threads: 0
Skill Endorsements: 0
© 2013 DaniWeb® LLC
Page rendered in 0.3159 seconds
using 2.72MB