Impressum Suchfunktion

NOF-Schule | Forum

zur Schule NOF-NetObjects-Tutorials von Tommy Herrmann


Mobirise - Logogröße
#1
Mit den Zeilen
.navbar-dropdown .navbar-logo img {
height: 60%;
width: 60%;
}

.navbar-dropdown.navbar-short .navbar-logo img {
height: 40%;
width: 40%;
}

kann man ja die Logogröße bestimmen.
Im Tablet-Modus fehlt da aber was.
Wie ist denn die Syntax für die Logo-Größe mit mittleren Bereich?
Müsste sowas wie
.navbar-dropdown.navbar-medium sein.

Gruß aus Salzburg
Frank
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#2
Moin,

also eigentlich wird sich das Logo ja durch die Prozentzahl jedem Gerät anpassen (warum sollte dann etwas fehlen :confused: ), so steht es bei mir:

Code:
.navbar-dropdown .navbar-logo img {
height: 80%;
width: 80%;
}

.navbar-dropdown.navbar-short .navbar-logo img {
height: 40%;
width: 40%;
}

http://www.mobirise-tutorials.com/Farbverlauf-Body.html

In der CSS-Datei von Mobirise:

/assets/dropdown/css/style.css

stehen auch nur diese beiden Klassen.

Die Eigenschaft aus "navbar-short" ist ja lediglich, dass das Logo grundsätzlich am schmalen Handy eben bedeutend kleiner dargestellt werden soll, um nicht z.B. die Navi oder andere Elemente zu überdecken.
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#3
Tja, trotzdem habe ich diesen Effekt.
http://www.afripix.de/solteq
....
Aber eine Runde Nachdenken hilft oft.
Wenn ich den Browser zusammenschiebe und das Logo groß bleiben würde, würden Teile der Navi verschwinden. OK, dann ist es einfach so :D
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#4
Habe jetzt nur das Handy hier und da passt es.
Gruss Andy

Wer Rechtschreibfehler findet, darf sie behalten... oder melden
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#5
Das hatte ich bei "meinen" Logos im Banner:
http://www.vogtland-geschichte.de/Urgeschichte.html
Bei dir haben Menü und Logo im mittleren Bereich kein Platz!
Ich wollte es mit Media Queries und unterschiedlichen Prozentangaben korrigieren! Das geht aber nicht.
Ich habe eine Pseudotabelle von Doris umgeschrieben. Das ist für das Menü zu kompliziert. Vielleicht fällt dir aber etwas ein!
HTML:
Code:
<section class="containerT" style="padding-top:120px; padding-bottom: 40px;background-color: rgb(76, 76, 76);">

<div class="container">
       
   
<div id="Table-1" class="table">
<!--erste Zeile Spaltentitel -->

<div class="row-content">
<div id="Polster1" class="cell"></div>
<div class="cell"><h1>Interessengemeinschaft
   Ur- und Frühgeschichte</h1></div>
<div id="Polster2" class="cell"></div>    
<div id="Polster3" class="cell"></div>
</div>

<div class="row-content">
<div id="Polster4" class="cell"></div>
<div class="cell"><h2>Jörg Fischer</h2><br>
<h3>Lützowstraße 29, 08523 Plauen/Vogtl.<br>
Leiter der IG Ur- und Frühgeschichte<br>
Internet: <a href="mailto:joergfischerplauen@gmail.com" target="_blank">joergfischerplauen@gmail.com</a></h3></div>
<div id="logoUF" class="cell mbr-figure"></div>    
<div id="Polster6" class="cell"></div>
</div>
</div>
</div>

</section>    
CSS:
Code:
.container {box-shadow: 0 5px 32px 0 rgba(0, 0, 0, 0.5), 0 12px 40px 0 rgba(0, 0, 0, 0.1);background-color:grey}
h1{
width: 100%;
max-width: 1000px;
padding-top: 20px;
text-align: center;
color: #ffffff;  
font-family: Montserrat;font-weight:bold;
font-size: 25px;
}
h2{
width: 100%;
max-width: 1000px;
margin: auto;
text-align: center;
color: #ffffff;
font-family: Montserrat;font-weight:bold;
font-size: 18px;
}
h3{
width: 100%;
max-width: 1000px;
padding-top: 10px;
text-align: center;
color: #ffffff;
font-family: Montserrat;
font-size: 18px;
}

#logoUF {
background: url(http://www.vogtland-geschichte.de/assets/images/logoufgschriftdreiecks3-1-1400x1400.png);
background-size: contain;background-repeat: no-repeat;
background-position: top;
}

.table{
width: 100%;
display: table;

background-color:grey;
font-family: Montserrat;
font-size: 14px;
}

.row-content{
width:100%;    
display: table-row;
background-color:grey}

.row-content:nth-child(even)
{background-color:grey;}

.cell{
display: table-cell;
text-align: right;
padding: 10px 15px;
background: ;}

.cell:nth-child(2){text-align: left; width: 50%}
.cell:nth-child(odd){font-size: 16px; font-weight: bold}

/*..................................................................S C R E E N S   B I S   8 5 0 p x */
@media screen and (max-width: 850px){



.cell-head:nth-child(2){text-align: center}
.cell span{font-weight: bold; font-size: 18px;}
   .cell:nth-child(2){text-align: left; width: 80%}
.cell:nth-child(odd){font-size: 16px; font-weight: bold}
.cell:last-child{ max-width: 100px; float: right; text-align: center; padding: 3px 10px; }

}
@media screen and (max-width: 600px){
#logoUF {
background: url();
background-size: contain;background-repeat: no-repeat;
background-position: top;
}
 #Polster1 {display: none;}  
 #Polster2 {display: none;}
 #Polster3 {display: none;}  
 #Polster4 {display: none;}  
 #logoUF {display: none;}  
 #Polster6 {display: none;}  
   
h1{
width: 100%;
max-width: 1000px;
margin: auto;
text-align: center;
color: #ffffff;
font-family: Montserrat;font-weight:bold;
font-size: 18px;
letter-spacing: 2px;}
h2{
width: 100%;
max-width: 1000px;
margin: auto;
text-align: center;
color: #ffffff;
font-family: Montserrat;font-weight:bold;
font-size: 16px;
letter-spacing: 1px;}
h3{
width: 100%;
max-width: 1000px;
margin: auto;
text-align: center;
color: #ffffff;
font-family: Montserrat;
font-size: 16px;
letter-spacing: 1px;}

}
Du könntest im mittl. Bereich (Tablet) die paddings oder die Schriftgröße des Menüs verkleinern!
Keine Zeit, muss Haare machen!
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren


Möglicherweise verwandte Themen...
Thema Verfasser Antworten Ansichten Letzter Beitrag
  Mobirise-Grafik oder Foto als Hintergrund über die ganze Seite Thomas Saake 11 170 Vor 36 Minuten
Letzter Beitrag: Martin73
  Mobirise 4 Tommy Herrmann 103 3.861 17.11.2017, 10:48
Letzter Beitrag: Tommy Herrmann
  Mobirise-Tables Sortierfunktion entfernen Thomas Saake 28 404 14.11.2017, 20:55
Letzter Beitrag: Martin73
  Mobirise-Countdown korrekt einstellen Thomas Saake 5 97 14.11.2017, 12:32
Letzter Beitrag: Tommy Herrmann
  Mobirise-Farbverlauf über die ganze Seite Thomas Saake 19 567 13.11.2017, 15:19
Letzter Beitrag: Thomas Saake
  Mobirise und seine Icons stobi_de 2 110 11.11.2017, 12:28
Letzter Beitrag: Thomas Saake
  Mobirise-Text verschiebt sich auf Smartphone Thomas Saake 3 77 10.11.2017, 11:27
Letzter Beitrag: c-laus
  Mobirise-Textgröße Smartphone Thomas Saake 14 218 07.11.2017, 15:10
Letzter Beitrag: Tommy Herrmann
  Mobirise 4 - das GLOBAL Attribut ? stobi_de 25 428 07.11.2017, 11:46
Letzter Beitrag: Tommy Herrmann
  Mobirise - eine Alternative zu NOF? Ralf-HH 17 340 07.11.2017, 08:42
Letzter Beitrag: Rancher



Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste
nach oben An den Anfang der Seite scrollen
NetObjects Fusion Infos, Downloads und Updates Diese Website wird durch Bot-Trap vor Spam geschützt!