cece.indiana.eduWie setze ich Text in die Titelleiste des mobilen Menüs in meinem Code?
Das mobile Menü funktioniert gut; Ich kann jedoch nicht herausfinden, wie man Text in der Titelleiste hinzufügt. Auf der rechten Seite des Hamburgermenüs möchte ich Text. Wie würde ich das tun? Ich habe ungefähr eine Stunde mit diesem winzigen Neuling verbracht, aber ich kann es nicht verstehen! image of the title bar
Das Tric ist zu verwenden float: left. Hier ist die CSS:
CSS
#titleBar .toggle {
height: 60px;
left: 0;
position: relative; /*to make the float work*/
top: 0;
width: 80px;
z-index: 2;
float: left; /*the magic*/
}
#titleBar .title {
display: block;
position: relative;
letter-spacing: 2px;
line-height: 44px;
font-size: 1.3em;
font-weight: 700;
text-align: left; /*possibly what you meant*/
text-transform: uppercase;
color: #fff;
z-index: 1;
float: left; /*the magic*/
}
Float macht die Spannweiten schwimmen nebeneinander, Sie Problem zu lösen. Hoffe das wird helfen!
Ich habe meinen Code ein wenig geändert. Obwohl es auf der Online-Webseite nicht angezeigt wird, konnte ich CECE in der Titelleiste anzeigen, indem ich ein HTML-Element mit der ID "logo" erstellte und es CECE nannte. Wenn ich dies jedoch tue, erkennt Google Chrome die Webseite als mobil und zeigt nur die mobile Webseite an. Es gibt nichts in meinem CSS, das zu sagen, und es funktioniert in anderen Browsern. Ich habe meinen Cache geleert und bin sehr verwirrt. – Curb
Das ist eigenartig. Kann ich den Code dieser Version sehen? –
Habe ich nur noch das in der Chrome-Konsole, aber dieses Bit hinzufügen, nachdem <span class="toggle"
<span class="toggle-right-title">Text</span>
Dann sollte die CSS diese aussehen
.toggle-right-title {
margin-left: 35px;
font-size: 20px;
color: #fff;
font-weight: bold; }
Sie können dies ändern und anpassen, wie
zu sein braucht
Also wollen Sie den Text direkt neben dem Hamburger, nicht in der Mitte, wo es gerade ist? –