2016-07-15 8 views
0

Dies ist eine Art der gleichen Frage, die ich hier gefragt: Cannot get two CSS elements to be next to each otherProbleme, sobald ich iframe hinzugefügt

Doch dieses Mal, es vermasselt, wenn ich einen Iframe hinzugefügt. Ich habe versucht, verschiedene Stile anzuwenden, sogar für den iframe, aber es scheint nicht zu funktionieren. Ich habe auch mit dem CSS der ul und li, die ich hinzugefügt, um die Seite nav bar (nicht geholfen, obwohl Ändern der ul-Eigenschaft zur Anzeige: Tabelle-Zeile; habe ein anderes Problem, das ich mit etwas anderes hatte.)

Mein Hauptplan war, einen iframe zu einer anderen Gruppe von Seiten zu haben. (Meine Restaurantseiten haben vielleicht mehr als einen Tab für jedes Restaurant, aber ich habe mich gefragt, wie ich ein "Zurück" zu meinem Skiort (wo die Restaurants sind) haben könnte, damit der Benutzer zu ihnen zurückkehren kann. ? warum nicht nur statt einen iframe hat

aber sobald ich den iframe hinzugefügt, die Mühe, die ich vorher hatte (siehe vorherigen Stapelüberlauf Link oben) plötzlich kam zurück

main.css.

#logo 
{ 

border: 1px dashed purple; 
width: 1050; 
height: 75; 

} 

#logo > img 
{ 
width: 1050; 
height: 75; 

} 


.floatleft 
{ 
float: left; 

} 


.floatright 
{ 
float: right; 

} 

#content 
{ 

border-left: 3px solid #283379; 
    border-right: 3px solid #283379; 
    text-align: left; 
    margin: 0 auto; 


width: 960px; 
    background-color: #ffffff; 
    background-repeat: repeat-y; 
    height: 800; 



} 


nav 
{ 


     border: 10px solid transparent; 
padding: 15px; 
    border-image-source: url(./blue-diamond.gif); 
    border-image-repeat:repeat; 
    border-image-slice: 30; 

background-color: 2211ff; 
font-family: "Impact", Times, serif; 
font-size: 110%; 

} 

nav#vert 
{ 

width: 220px; 
    height: 540px; 
    margin: 0px; 
display:table-cell; 


} 



body { 
    color: #000000; 
    margin: 0; 
    padding: 0; 
    font-family: Helvetica, Arial, sans-serif; 
    font-size: 16px; 
    background-color: #422520; 
    background-image: url(./snow_mountain.jpg); 
    background-repeat:no-repeat; 

    background-size:cover; 
    text-align: center; 
    background-attachment: fixed; 
    background-position: center; 
} 

#footerContainer 
{ 

border-left: 3px solid #283379; 
    border-right: 3px solid #283379; 
    text-align: left; 
    margin: 0 auto; 
    width: 980px; 
    background-color: #ffffff; 
    background-repeat: repeat-y; 

} 

footer 
{ 

    border: 10px solid transparent; 
padding: 15px; 


    text-align: left; 
    margin: 0 auto; 
    width: 1000px; 

    background-repeat: repeat-y; 

    border-image-source: url(./blue-diamond.gif); 
    border-image-repeat:repeat; 
    border-image-slice: 30; 

background-color: 2211ff; 
font-family: "Impact", Times, serif; 
font-size: 14px; 
color: white; 

} 


footer > a 
{ 
color: white; 
font-family: "Impact", Times, serif; 
font-size: 14px; 

} 

#container 
{ 
    border-left: 3px solid #283379; 
    border-right: 3px solid #283379; 
    text-align: left; 
    margin: 0 auto; 
    width: 1050px; 
    background-color: #ffffff; 
    background-repeat: repeat-y; 
    height: 750px; 

} 


nav > a 
{ 

color: #ccccff; 

} 

nav#hor > div 
{ 

border: 1px solid white; 
float: left; 
padding: 10px; 
background-color: #000044; 
} 

nav#hor 
{ 
width: 1000px; 
height: 50px; 
margin: 0; 
font-size: 110%; 

} 


nav#hor a 
{ 

color: rgb(0 0,238); 
} 


nav#hor > div > a 
{ 

color: #ccccff; 
text-decoration: none; 
font-size: 100%; 
} 



nav#hor>div:hover 
{ 

background-color: #018802; 

} 

h1 
{ 
font-family: "MV Boli", Times, Serif; 

font-style: bold; 
text-align: center; 
font-size: 36px; 

} 

h2 
{ 

font-family: "MV Boli", Times, Serif; 
font-style: bold; 
text-align: center; 
font-size: 26px; 
} 

h3 
{ 

font-family: "MV Boli", Times, Serif; 
font-style: bold; 
text-align: center; 
font-size: 20px; 
} 




#text-container 
{ 





border: 2px solid cyan; 



    width: 1005px; 
    height: 690px; 
    */ zoom: 1; 
    */ margin: 0; 
    display: table-cell; 


padding-top: 10px; 
    padding-right: 10px; 
    padding-bottom: 10px; 
    padding-left: 10px; 


} 



#text-container:after 
{ 
clear: both; 
    content: "."; 
    display: block; 
    height: 0; 
    visibility:hidden; 

} 

#text-container > p 
{ 
font-family: "Myriad Web Pro", Times, Serif; 
font-size: 18px; 
} 

.left img 
{ 

float: left; 
padding: 0 20px 20px 0; 

} 





.left > p 
{ 
font-family: "Myriad Web Pro", Times, Serif; 
font-size: 18px; 
} 


.right img 
{ 
float: right; 
    margin: 0px 0px 15px 20px; 
    border: 1px solid transparent; 

} 



.right > p 
{ 
font-family: "Myriad Web Pro", Times, Serif; 
font-size: 18px; 
} 


nav#hor ul 
{ 
list-style-type: none; 
    margin: 0; 
    padding: 0; 
    overflow: auto; 
    background-color: #000044; 

} 

nav#hor ul li:hover 
{ 
    background-color: #018802; 

} 


nav#vert ul 
{ 
list-style-type: none; 
    margin: 0; 
    padding: 0; 
    overflow: auto; 
    background-color: #000044; 
    display: table-row; 

} 
nav#hor li 
{ 
float: left; 
border: 1px solid white;. 

} 

nav#vert li 
{ 
float: left; 
border: 1px solid white;. 

} 


nav#vert li a, .dropbtn { 
    display: inline-block; 
    // color: white; 
    text-align: center; 
    padding: 8px 8px; 
    text-decoration: none; 
} 


nav#hor li a, .dropbtn { 
    display: inline-block; 
    // color: white; 
    text-align: center; 
    padding: 8px 8px; 
    text-decoration: none; 
} 


nav#hor li a:hover, .dropdown:hover .dropbtn { 
    background-color: #018802; 
} 

nav#vert li a:hover, .dropdown:hover .dropbtn { 
    background-color: #018802; 
} 


li.dropdown { 
    display: inline-block; 
} 

.dropdown-content ul li 
{ 

width: 100%; 
} 
.dropdown-content { 
    display: none; 
    position: absolute; 
    background-color: #f9f9f9; 
    min-width: 160px; 
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); 
     color: rgb(0, 0, 238); 
    z-index: 1; 

} 

#eAndADropdown 
{ 


} 

#restaurantDropdown li 
{ 
background-color: #000044; 
border: 1px solid white; 

} 

#restaurantDropdown ul 
{ 
border: 1px solid white; 

} 



#restaurantDropdown:hover 
{ 
    background-color: #018802; 
} 

#restaurantDropdown a 
{ 
    color: rgb(0, 0, 238); 

} 

.dropdown-content a { 
    color: rgb(0, 0, 238); 
    border: 1 px solid white; 
    padding: 12px 16px; 
    text-decoration: none; 
    display: block; 
    text-align: left; 
} 

.dropdown-content a:hover {background-color: #f1f1f1} 

.show {display:block;} 

li a 
{ 

color: rgb(0, 0, 238); 
} 

testenMongoose.php

Diesmal mit display: table-cell; sowohl nav # vert als auch # text-content scheinen nicht genug zu sein wie zuvor.

+0

keine Sie einzelne Seiten nicht iframes Ihrer eigenen Seiten wollen (obwohl ich in der Lage sein sollte, diejenigen zu beheben.) auf einer Seite wordpress kann für Sie sein https://wordpress.org/ –

+0

Dies ist keine Wordpress-Seite. – MongooseLover

+0

Nicht sicher, was los ist. – MongooseLover

Antwort

0

float: left auf dem nav # vert scheint, dass Problem behoben zu haben, obwohl es einige andere Dinge brach

+0

"Oh guck! Ich habe ...." Repariert #theWorldOfCSS –