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!
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren


Möglicherweise verwandte Themen...
Thema Verfasser Antworten Ansichten Letzter Beitrag
  Textfarbe in Mobirise weiß aber im Browser schwarz kfz-fotograf 9 102 Vor 52 Minuten
Letzter Beitrag: Thomas Saake
  Mobirise: Fremde Navigation einbauen? stobi_de 11 171 Gestern, 16:38
Letzter Beitrag: stobi_de
  Mobirise 4 Themes in Mobirise 3 ? kfz-fotograf 6 113 24.07.2017, 16:41
Letzter Beitrag: Reika066
  NOF Seite um gestellt auf Mobirise, Umleitung auf die neue Seite? ostseepyramide 16 149 24.07.2017, 12:09
Letzter Beitrag: Doris Rehhausen
  Mobirise-Modal & Co. Thomas Saake 19 271 23.07.2017, 22:29
Letzter Beitrag: Martin73
  Mobirise Hilfe ostseepyramide 75 905 16.07.2017, 16:21
Letzter Beitrag: ostseepyramide
  Mobirise-Blocksatz Thomas Saake 12 189 13.07.2017, 11:36
Letzter Beitrag: Doris Rehhausen
  Mobirise-Aussehen Klappmenü Thomas Saake 11 231 12.07.2017, 14:09
Letzter Beitrag: Martin73
  Mobirise-aktuelle Meldungen und Zeitleiste Thomas Saake 27 482 12.07.2017, 13:06
Letzter Beitrag: Martin73
  Funktionsweise Mobirise-Kontaktformular? stobi_de 55 1.114 04.07.2017, 13:13
Letzter Beitrag: Thomas Saake



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!