• Closed
• Sanschnei

  Spectator

  October 8, 2015 at 6:44 pm #21292

  

  Hi there,

  I have a problem with the responsive design/responsive navigation, it doubles, but just on the homepage. Could you help?

  http://prntscr.com/8p40nl

  URL

  Home

  I didn’t change a thing on the homepage, just updated to wordpress 4.3.1 and added a few things on the .htaccess file to speed on the site.

  Thanks.
  Sandra

Denzel Chia
Moderator
Posts: 2656
October 9, 2015 at 11:11 am #21296

Hi,
I did not see a double menu on my iPhone 6.
Please see screenshots.
View post on imgur.com
View post on imgur.com
Perhaps you have found a solution?
Thanks!
Denzel
Sanschnei
Spectator
Posts: 31
October 13, 2015 at 1:05 pm #21389

When you load the site once you don’t see the bug. But when you load it again or touch on the logo the menu is shown twice. As well on an android phone.
What could it be?
Here is my custom css
/* Anpassungen Bootstrap Slider */
#bootstrap-slider .carousel-caption {
background: none;
left: 0;
right: 0;
padding-top: 0;
padding-bottom: 40px;
bottom: 0;
}
#bootstrap-slider .carousel-caption h2 {
background: none;
padding-top: 0;
padding-bottom: 110px;
bottom: 0;
text-shadow: 3px 3px 3px rgba(0, 0, 0, 1);
}
#bootstrap-slider .carousel-caption .button {
background: rgba(0,0,0,.4);
border-width: 2px;
border-color: rgba(255,255,255,.8);
box-shadow: none;
bottom: 100px;
position: relative;
}
/*Formatierung responsive Bootstrap slider*/
@media screen and (max-width: 768px) {
#bootstrap-slider .carousel-caption p, #bootstrap-slider .carousel-caption .button {
cursor: pointer;
display: block !important;
margin: 0 auto;
width: 60px !important;
}
}
@media screen and (max-width: 768px) {
#bootstrap-slider .carousel-caption h2 {
padding-top: 15px;
padding-bottom: 15px;
margin-top: 0;
}
}
@media screen and (max-width: 768px) {
#bootstrap-slider .carousel-caption .button {
bottom: -15px;
position: relative;
}
}
/*Formatierung Abstand zum Head*/
.absatzneg {
margin-top: -40px;
}
.content {
padding-top: 1px!important;
}
/*Formatierung Indivdueller Absatz*/
.absatz-home {
margin-top: -30px;
}
.absatz-home2 {
padding: 0px 0px;
}
/*Formatierung Links im Text*/
a.black:hover{
color: #000000;
}
a.black2:hover{
color: #000000;
font-weight: bold;
}
/*Formatierung Zeilenhöhe Text*/
.post p {
line-height: 1.5em;
}
.one_half, .one_third, .two_third, .three_fourth, .one_fourth {
line-height: 1.5em;
}
/*Formatierung Zeilenhöhe Auflistung*/
.entry-content ul.list-icon li {
line-height: 1.5em;
}
/*Formatierung h5 home willkommen*/
h5.wilk{
font-size: 20px;
line-height: 20px;
margin-top: -10px;
}
/*Formatierung für sticky-header*/
body #header.sticky-header #sticky-nav a {
font-size: 18px!important;
}
/*Formatierung für header*/
.link-effect a span {
-moz-transition: none;
}
/*Formatierung für Button blue*/
.button.blue {
background-image: linear-gradient(top, #377caa 0%, #377caa 100%);
background-image: -o-linear-gradient(top, #377caa 0%, #377caa 100%);
background-image: -moz-linear-gradient(top, #377caa 0%, #377caa 100%);
background-image: -webkit-linear-gradient(top, #377caa 0%, #377caa 100%);
background-image: -ms-linear-gradient(top, #377caa 0%, #377caa 100%);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #377caa),color-stop(1, #377caa));
border: 1px solid #ffffff;
}
.no-cssgradients .button.blue {
background-color: #377caa;
}
/*Formatierung tabs */
.tabset.tabs {
border-right: 1px solid #e0dddd !important;
}
/*Formatierung für Footer */
.footer .widget-content {
background: none;
border: 0;
box-shadow: none;
}
.footer .widget:after {
background: none;
}
#text-2
.widget-title {
text-transform: uppercase;
font-size: 18px;
line-height: 18px;
}
#text-2
.widget-title-background {
color: #377caa;
}
#text-2
.widget-title a {
color: #377caa !important;
}
#text-2
.widget-content {
font-size: 14px !important;
text-transform: uppercase;
background: none !important;
border: none !important;
box-shadow: none !important;
-box-shadow: none !important;
-moz-box-shadow: none !important;
-webkit-box-shadow: none !important;
}
#text-3
.widget-title {
text-transform: uppercase;
font-size: 18px;
line-height: 18px;
}
#text-3
.widget-content {
font-size: 14px !important;
text-transform: uppercase;
background: none !important;
border: none !important;
box-shadow: none;
-box-shadow: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
}
#text-4
.widget-title {
text-transform: uppercase;
font-size: 18px;
line-height: 18px;
}
#text-4
.widget-content {
font-size: 14px !important;
text-transform: uppercase;
background: none !important;
border: none !important;
box-shadow: none;
-box-shadow: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
}
#text-5
.widget-title {
text-transform: uppercase;
font-size: 18px;
line-height: 18px;
}
#text-5
.widget-content {
font-size: 14px !important;
text-transform: uppercase;
font-size: 15px;
background: none !important;
border: none !important;
box-shadow: none;
-box-shadow: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
}
/*Formatierung für Reading Box*/
.reading-box-container {
margin: 20px 0 0;
}
.reading-box-container .reading-box {
padding-bottom: 80px;
}
.reading-box-container .button {
bottom: 20px;
position: absolute;
}
/* Contact Form 7 */
.wpcf7 p {
text-transform: none;
}
.wpcf7 textarea
{
background-color: #fff;
color: #000;
width: 100%;
}
#name
{
background-color: #fff;
color: #000;
width: 100%;
}
#adresse
{
background-color: #fff;
color: #000;
width: 100%;
}
#plz
{
background-color: #fff;
color: #000;
width: 100%;
}
#ort
{
background-color: #fff;
color: #000;
width: 100%;
}
#email
{
background-color: #fff;
color: #000;
width: 100%;
}
#telefon
{
background-color: #fff;
color: #000;
width: 100%;
}
#captchar2
{
background-color: #fff;
color: #000;
width: 100%;
}
#captchar1
{
background-color: #fff;
color: #000;
width: 30%;
}
/* Vantage Contact Form 7 Submit Button */
.wpcf7 input[type="submit"] {
background-image: linear-gradient(top, #377caa 0%, #377caa 100%);
background-image: -o-linear-gradient(top, #377caa 0%, #377caa 100%);
background-image: -moz-linear-gradient(top, #377caa 0%, #377caa 100%);
background-image: -webkit-linear-gradient(top, #377caa 0%, #377caa 100%);
background-image: -ms-linear-gradient(top, #377caa 0%, #377caa 100%);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #377caa),color-stop(1, #377caa));
border: 1px solid #ffffff;
}
/*Formatierung Indivdueller Absatz*/
.absatz-home {
margin-top: 10px;
}
.absatz-home2 {
margin-top: -16px;
}
/*Formatierung Button Senden Buchung*/
.button-senden-buchung {
background-color: #377caa;
}
.link-effect a span {
-moz-transition: none;
}
.tabset.tabs {
border-right: 1px solid #e0dddd !important;
}

Thanks for your help.
Sandra
Denzel Chia
Moderator
Posts: 2656
October 14, 2015 at 12:25 pm #21412

Hi,
Did you modify any template? or added any code other than css?
I have never come across css being able to duplicate something.
Did you try disabling one plugin at a time to find out if there is any conflicting plugin?
Thanks!
Sanschnei
Spectator
Posts: 31
October 15, 2015 at 5:22 pm #21447

Hi Denzel,
it was the plugin cachify that causes the bug.
Thanks for your help.
Sandra

The topic Double navigation bar in responsive design is closed to new replies