响应式设计在California Responsive BigCommerce模板上

时间:2017-04-07 08:43:12

标签: css responsive-design themes bigcommerce

我正在为能够应对大多数设计基础知识的人寻找一些简单的指导,但我被困在findmethatwine.com的网站设计的一个区域

Dektop网站正在按我们的意愿工作(总是有改进空间,但是嘿)。这是我正在努力解决的一个领域的响应方。当您将屏幕尺寸减小到平板电脑或移动设备时,模板会响应该网站的徽标。问题是我想将徽标浮动到屏幕的左侧(对于移动设备),这样我们就有空间使用屏幕的右侧为重要的免费送货创建类似的内容块并保证信息显示在完整的桌面网站上。

我已尝试在网站的css中留下所有方式的基本浮动,并且当移动徽标时,它会导致右上角链接的样式问题,尤其是完全混乱的登录链接。

任何有关如何实现这一目标或解决方法的线索都会非常有用,因为我或我的同事都无法解决这个问题。

很抱歉,如果我遗漏了您需要的任何有用信息,请询问。

1 个答案:

答案 0 :(得分:1)

一个选项是你的样式表@
https://cdn5.bigcommerce.com/r-cd74cb12e5d8e952a812b68d3d60382a14b97a1e/themes/California/Styles/responsive.css

转到第128行并将规则更改为

.header-logo-mobile{ display:block; margin:0 auto; display:table; width:96%; text-align:left; padding:20px 0 16px;}  

然后,您通过简单的文本对齐属性来定位徽标,如果您将徽标浮动并将其从流动中移除,则可能会减少您的悲伤。

祝你好运!