google的实现方式是:

<div class="mw">

  <a href="/" id="mlogo">  </a>

  <div id="tsfi" style="zoom:1"></div>

</div>

图片可以作为a标签的背景或者嵌套子a标签里面,为a标签设置绝对定位,右面搜索框为正常块,为右面的搜索框设置margin-left即可

具体如下,也可直接去看google搜索页

.mw{

  max-width:100%;

}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi)
 

#mlogo {

  background-image: url(/images/logo_mobile_srp_highres_3.png);

}
#mlogo {
  background: url(/images/logo_mobile_srp_3.png) no-repeat;
  background-size: 75px 26px;
  color: transparent;
  width: 75px;
  height: 26px;
  left: 9px;
  position: absolute;
  text-align: center;
  top: 8px;
}
#tsfi {
  margin-left: 102px;
  -webkit-transition: all .15s;
}

左侧图片 右侧块的实现方法---解决3像素bug的一种解决方案,不用浮动用绝对定位和margin-left的更多相关文章

  1. jQuery左侧图片右侧文字滑动切换代码

    分享一款jQuery左侧图片右侧文字滑动切换代码.这是一款基于jQuery实现的列表图片控制图片滑动切换代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div cla ...

  2. bootstrap实现左侧图片右侧文字布局

    效果图 代码 通过class="media-left"来控制相对位置 <!DOCTYPE html> <html> <head lang=" ...

  3. bugfree如何修改Bug7种解决方案的标注方法

    Bug有7种解决方案的标注方法 By Design- 就是这么设计的,无效的Bug Duplicate - 这个问题别人已经发现了,重复的Bug External - 是个外部因素(比如浏览器.操作系 ...

  4. 解决TextView drawableRight左侧图片大小不可控的问题

    通过代码来修改图片的大小: Drawable rightDrawable= context.getResources().getDrawable(R.drawable.more); rightDraw ...

  5. 解决IDEA右侧maven不显示方法

    解决IDEA右侧maven不显示方法 Ctrl+shift+A --> maven--> add maven projects -->选择对应的pom.xml

  6. after及before伪元素及解决父元素塌陷的几种方法

    一.伪类和伪元素 CSS中伪类和伪元素有很多,也很好用!如果熟练使用的话可以解决很多问题 首先明白什么是伪类:伪类是基于当前元素的状态,而不是元素的id class等静态标志,它是动态变化的,它会在一 ...

  7. 学习笔记:Maven构造版本号的方法解决浏览器缓存问题

    需要解决的问题 在做WEB系统开发时,为了提高性能会利用浏览器的缓存功能,其实即使不显式的申明缓存,现代的浏览器都会对静态文件(js.css.图片之类)缓存.但也正因为这个问题导致一个问题,就是资源的 ...

  8. android通过BitmapFactory.decodeFile获取图片bitmap报内存溢出的解决办法

    android通过BitmapFactory.decodeFile获取图片bitmap报内存溢出的解决办法 原方法: public static Bitmap getSmallBitmap(Strin ...

  9. 【转】简单内存泄漏检测方法 解决 Detected memory leaks! 问题

    我的环境是: XP SP2 . VS2003 最近在一个项目中,程序退出后都出现内存泄漏: Detected memory leaks! Dumping objects -> {98500} n ...

随机推荐

  1. FormatFloat

    http://www.delphibasics.co.uk/RTL.asp?Name=FormatFloat 1  function FormatFloat ( const Formatting : ...

  2. 解决scrollView中嵌套viewPager的冲突问题

    很简单,在外层ScrollView中添加android:fillViewport="true"属性,然后给viewPager添加一个固定高度

  3. Memcache 统计分析!

    status settings status slabs

  4. 嵌入式开发之simulation--- 双目移动dsp机器人

    http://foundy.blog.163.com/blog/static/263383442014112391130207/

  5. BlockingQueue的使用 http://www.cnblogs.com/liuling/p/2013-8-20-01.html

    BlockingQueue的使用 本例介绍一个特殊的队列:BlockingQueue,如果BlockQueue 是空的,从BlockingQueue取东西的操作将会被阻断进入等待状态,直到Blocki ...

  6. Codeforces Round #392 (Div. 2) F. Geometrical Progression

    原题地址:http://codeforces.com/contest/758/problem/F F. Geometrical Progression time limit per test 4 se ...

  7. PHP-Manual的学习----【语言参考】----【类型】-----【float浮点型】

    笔记:1.浮点型(也叫浮点数 float,双精度数 double 或实数 real)可以用以下任一语法定义: <?php$a = 1.234; $b = 1.2e3; $c = 7E-10;?& ...

  8. linux php.ini又一次载入问题

    今天发现自己server改动php.ini之后无法又一次载入! .无法使用php-fpm reload,奇怪.! 后来查了一下.能够使用 /etc/init.d/php-fpm reload 来又一次 ...

  9. xcode编译时,有第三方库时,编译设置build active architecture only问题

    本文转载至 http://blog.csdn.net/ysysbaobei/article/details/16371263 编译静态库 1.http://blog.csdn.net/dengdeng ...

  10. [原创]aaencode等类似js加密方案破解方法

    受http://tieba.baidu.com/p/4104806767 2L启发,不过他说的方法,我没有尝试成功,自己摸索出了一个新方法,在这里分享下. 首先拿aaencode官网的加密字符串作为例 ...