[问题] 图片与menu如何置中?

楼主: PowerKid (暴力小孩)   2015-06-10 19:26:17
https://jsfiddle.net/0vcgujge/1/
我现在有一张图 跟 MENU
我想要同时让 图跟MENU 都置中
但是目前我设定text-algin:center不知道为什么只有MENU置中
图片不会
有试过display:table;
margin:0 auto;的办法
但是会造成MENU有些项目往下掉没有同时显示在最上面那排
请问该如何同时置中
谢谢
作者: vivian070826 (pin)   2015-06-10 20:35:00
http://imgur.com/CvrxNHE不确定是不是你要的排法
作者: eggimage (目前没有名片)   2015-06-10 20:35:00
你的img没有设置inline或inline-block啊然后你要怎么排法 不是很懂text-align只对inline或inline-block有效你的排版是要怎样的? 弄个图来看等等 你是说你要menu+img全都置中? 都在同一行 图片当然不会置中 要不然就是其中一者被盖掉你的img和nav要排成sibling 然后设成inline block如果你图片必须在萤幕正中央 menu项目只能分左右或在不同行还是不了解你叙述的 所以才说你弄个图稿 不是code用绘图软件或是拿笔在纸上画示意图就可以了啊写网页第一步就是要先构图还有想运作流程你的图这样看来 照我上面说的方式可行 弄个container把logo跟nav都包起来 你可以选直接width 100%然后全inline然后text-align center 或是container限定宽度然后置中里面的东西float left你的.container的位置放错了啊
楼主: PowerKid (暴力小孩)   2015-06-10 22:43:00
有吗 不是包起来吗
作者: eggimage (目前没有名片)   2015-06-10 22:52:00
你的.container是整个在外面你现在是用header head包起来
楼主: PowerKid (暴力小孩)   2015-06-10 22:53:00
我用.head当container= =
作者: eggimage (目前没有名片)   2015-06-10 22:53:00
然后这几层的styling也不少问题
楼主: PowerKid (暴力小孩)   2015-06-10 22:54:00
抱歉 不太懂哪里错了不是名字不同而已吗 都包起来了
作者: eggimage (目前没有名片)   2015-06-10 22:55:00
container是个很笼统的名字 通常不会直接拿来用 而是会加个 xxx-container之类的 比如page-container不然示意的时候很容易搞混
楼主: PowerKid (暴力小孩)   2015-06-10 22:56:00
谢谢
作者: eggimage (目前没有名片)   2015-06-10 22:56:00
你的inline放错地方了是放到里面的东西 不是head这层
楼主: PowerKid (暴力小孩)   2015-06-10 22:59:00
了解了 所以inline跟float用法是一样的?
作者: eggimage (目前没有名片)   2015-06-10 23:02:00
然后你head那边width的冒号和分号都漏掉了float跟inline不一样 架构也要改https://jsfiddle.net/0vcgujge/5/这是你要的吧 就是置中 然后其他我就不修了
楼主: PowerKid (暴力小孩)   2015-06-10 23:08:00
谢谢e大的指教

Links booklink

Contact Us: admin [ a t ] ucptt.com