[SOLVED] Hariline Between Navbar and Page-Content on IOS

Hi Guys!

I’m having a problem when a put a div right above the navbar on IOS. It shows a small hairline and I couldn’t find where it’s defined on the CSS.

On android this does not occur.

Could anyone help me find where chan a solve that?

Heres the print and the code snippet:

 <div class="page" data-name="view-home">
		
		<!-- Navbar -->
		<div class="navbar no-hairline no-shadow">
			<div class="navbar-inner">
				<div class="title sliding">
					<i class="icon material-icons" style="margin-right: 8px; padding-bottom: 3px;">local_shipping</i>AppTruck
				</div>
				<div class="right">
					<a href="#" class="link icon-only panel-open" data-panel="right">
						<i class="icon f7-icons">person_round</i>
					</a>
				</div>
				<div class="title-large">
					<div class="title-large-text">AppTruck</div>
				</div>
			</div>
		</div>

		<!-- Conteúdo -->
		<div class="page-content">
			<div class="row no-gap" style="background-color: var(--f7-cor-principal); padding-left: 16px; padding-right: 14px; padding-bottom: 6px; padding-top: 6px;">
				<div class="col-10 text-color-white">
					<i class="icon material-icons">local_shipping</i>
				</div>
				<div class="col-70 text-color-white">
					 Olá <b><span id="USER-NOME-VIEW-HOME">Maycon</span></b>, você está na boléia de: <b><div id="CONTEUDO-VEICULO-DADOS"><span id="USER-VEICULO-PLACA-VIEW-HOME">AZQ-0320</span> (<span id="USER-VEICULO-APELIDO-VIEW-HOME">Negão</span>)</div></b>
				</div>
				<div class="col-20 text-align-right">
					<a href="/veiculo-lista/" class="text-color-white">Trocar</a>
				</div>
			</div>

			<div id="CONTEUDO-PRINCIPAL" class="text-align-center">

in css, try looking for sth:after

1 Like

Thanks @gowy11. Not quite that but it gave a clue where to look.
Actually it was the –f7-bars-border-color variable :wink:

Thanks bro!

1 Like