基金会电子邮件---雷鸟RWD

时间:2019-03-11 14:00:26

标签: html inky

我已经创建了响应电子邮件并且可以正常工作,但问题出在Thunderbird上。当我进入断点时,所有列的宽度看起来都是100%,但应该是50%。 我添加了一些屏幕视图和代码。 请帮忙...

屏幕1-正确 http://elskiba.pl/mobile-view.jpg 屏幕-1雷鸟 http://elskiba.pl/html-mail-issue.jpg

<container
	style="border-bottom:1px solid #ffcc00;padding:0 2px;background:#fff;"
>
	<row class="collapse">
		<columns small="12" large="6">
			<row>
				<!-- column 1 -->
				<columns
					small="4"
					style="padding-top:14px; padding-bottom:20px; padding-left:5px;padding-right:0"
				>
					<img
						width="106"
						src="{{ faceurl }}"
						alt="portret"
						style="width:106px;max-width:106px"
						class="float-center"
					/>
				</columns>
				<!-- column 1-- end -->
				<!-- column 2 -->
				<columns
					small="8"
					style="padding-top:14px; padding-bottom:20px"
				>
					<row>
						<columns small="2" large="2" align="center">
							<a
								href="{{ linkedinlink }}"
								style="margin-right:8px;display:block"
								><img
									width="25"
									height="25"
									src="https://chop-chop.org/app/uploads/2019/02/linkedin_yellow_icon.jpg"
									alt="linkedin"
									class="float-right"
							/></a>
						</columns>
						<columns small="10" large="10">
							<h1 style="line-height: 1">
								<a href="{{ linkedinlink }}"
									><strong>{{ name }}</strong></a
								>
							</h1>
							<p style="line-height: 1">{{ position }}</p>
						</columns>
					</row>

					<spacer size="18"></spacer>

					<row>
						<columns small="2" large="2"></columns>
						<columns small="10" large="10">
							<p style="color:#000">
								<strong
									><a
										href="{{ contact }}"
										style="text-decoration:none;"
										><span
											style="color:#000 !important;text-decoration:none !important"
											>{{ contact }}</span
										></a
									></strong
								>
							</p>
							<p style="color:#000">
								<a href="http://chop-chop.org"
									><strong
										><span
											style="color:#000;text-decoration:none"
											>chop-chop.org</span
										></strong
									></a
								>
							</p>
							<p style="color:#000">
								<a href="http://chop-chop.org/blog"
									><span
										style="color:#000;text-decoration:none"
										>chop-chop.org/blog</span
									></a
								>
							</p>
						</columns>
					</row>
				</columns>
				<!-- column 2-- end -->
			</row>
		</columns>
		<columns small="12" large="6">
			<row>
				<columns
					small="4"
					large="4"
					style="padding-top:14px; padding-bottom:20px"
				>
					<a href="http://chop-chop.org" style="display:block">
						<img
							width="61"
							height="71"
							src="{{ companylogo }}"
							alt="company logo"
							class="float-center"
						/>
					</a>
				</columns>
				<!-- column 4 -->
				<columns
					small="8"
					large="8"
					style="padding-top:14px; padding-bottom:20px"
				>
					<row>
						<columns small="2" large="0"></columns>
						<columns small="10" large="12">
							<h2><strong>Chop-Chop Sp.z.o.o.</strong></h2>
							<p>
								<span style="color:#000;text-decoration:none"
									>ul Szewska 3a</span
								>
							</p>
							<p style="color:#000">
								<span style="color:#000;text-decoration:none"
									>50-053 Wrocław PL
								</span>
							</p>
						</columns>
					</row>
					<spacer size="18"></spacer>
					<row>
						<columns small="2" large="0" valign="bottom"></columns>
						<columns small="10" large="12" valign="bottom">
							<a
								href="https://www.linkedin.com/company/chop-chop-org"
								><img
									width="25"
									height="25"
									src="https://chop-chop.org/app/uploads/2019/02/linkedin_icon.jpg"
									alt="linkedin"
									style="display:inline-block;margin-right:4px;width:25px;height:25px"
							/></a>

							<a href="https://www.instagram.com/chopchopers/"
								><img
									width="25"
									height="25"
									src="https://chop-chop.org/app/uploads/2019/02/instagram_icon.jpg"
									alt="instagram"
									style="display:inline-block;margin-right:4px;width:25px;height:25px"
							/></a>

							<a href="https://www.facebook.com/chopchoporg"
								><img
									width="25"
									height="25"
									src="https://chop-chop.org/app/uploads/2019/02/facebook_icon.jpg"
									alt="facebook"
									style="display:inline-block;margin-right:4px;width:25px;height:25px"
							/></a>

							<a href="https://github.com/chop-chop-org"
								><img
									width="25"
									height="25"
									src="https://chop-chop.org/app/uploads/2019/02/github_icon.jpg"
									alt="github"
									style="display:inline-block;margin-right:4px;width:25px;height:25px"
							/></a>

							<a href="https://clutch.co/profile/chop-chop"
								><img
									width="25"
									height="25"
									src="https://chop-chop.org/app/uploads/2019/02/clutch_icon.jpg"
									alt="clutch"
									style="display:inline-block;margin-right:4px;width:25px;height:25px"
							/></a>
						</columns>
					</row>
				</columns>
				<!-- column 4 end -->
			</row>
		</columns>
	</row>
</container>

0 个答案:

没有答案