This question is not answered. Helpful answers available: 1. Correct answers available: 1.


Permlink Replies: 10 - Pages: 1 - Last Post: 11 Jun 22, 16:32 Last Post By: Merlin2504 Threads: [ Previous | Next ]
Merlin2504

Posts: 333
Registered: 25-Jul-2016
change width
Posted: 7 Jun 22, 16:44
 
  Click to reply to this thread Reply
Is there a way to adjust the width?

1. Desktop
2. mobile view
Laza

Posts: 2,061
Registered: 6-Sep-2005
Re: change width
Posted: 7 Jun 22, 17:04   in response to: Merlin2504 in response to: Merlin2504
 
  Click to reply to this thread Reply
This centered title is designed to lay over a background image. This is why it's not full width. You can use this custom code to make it wider:
@media screen and (min-width: 30rem)
.header .head-cont.centered .head {
    max-width: 100%;
}
@media screen and (min-width: 40rem)
.header .head-cont.centered .head {
    max-width: 100%;
}
@media screen and (min-width: 64rem)
.header .head-cont.centered .head {
    max-width: 100%;
}
Merlin2504

Posts: 333
Registered: 25-Jul-2016
Re: change width
Posted: 8 Jun 22, 08:02   in response to: Laza in response to: Laza
 
  Click to reply to this thread Reply
Where do I have to insert the code?
Do you have a screenshot?
Laza

Posts: 2,061
Registered: 6-Sep-2005
Re: change width
Posted: 8 Jun 22, 09:34   in response to: Merlin2504 in response to: Merlin2504
 
  Click to reply to this thread Reply
Settings / Photoblogger / Advanced / Custom code / CSS
Merlin2504

Posts: 333
Registered: 25-Jul-2016
Re: change width
Posted: 8 Jun 22, 15:09   in response to: Laza in response to: Laza
 
  Click to reply to this thread Reply
Laza

Posts: 2,061
Registered: 6-Sep-2005
Re: change width
Posted: 8 Jun 22, 15:51   in response to: Merlin2504 in response to: Merlin2504
 
  Click to reply to this thread Reply
The code is not present in the linked album. Either it was not added, not run a "Make album", or not uploaded.
Merlin2504

Posts: 333
Registered: 25-Jul-2016
Re: change width
Posted: 8 Jun 22, 16:46   in response to: Laza in response to: Laza
 
  Click to reply to this thread Reply
Completed the album now. Don't see the code either?
Laza

Posts: 2,061
Registered: 6-Sep-2005
Re: change width
Posted: 8 Jun 22, 18:04   in response to: Merlin2504 in response to: Merlin2504
 
  Click to reply to this thread Reply
Sorry, it's there now. I have just copy/pasted this code from the developer console and didn't notice the missing curly braces. Here's the code again - replace the old one:
@media screen and (min-width: 30rem) {
.header .head-cont.centered .head {
    max-width: 100%;
}}
@media screen and (min-width: 40rem) {
.header .head-cont.centered .head {
    max-width: 100%;
}}
@media screen and (min-width: 64rem) {
.header .head-cont.centered .head {
    max-width: 100%;
}}
Merlin2504

Posts: 333
Registered: 25-Jul-2016
Re: change width
Posted: 10 Jun 22, 10:02   in response to: Laza in response to: Laza
 
  Click to reply to this thread Reply
Thanks, in the top level it works in my opinion.
But not the lower levels?

upper level: https://duhlendorf.com/Bilder-68.Session/

lower level: https://duhlendorf.com/Bilder-68.Session/eroeffnung-markt131121/index.html
Laza

Posts: 2,061
Registered: 6-Sep-2005
Re: change width
Posted: 10 Jun 22, 11:55   in response to: Merlin2504 in response to: Merlin2504
Helpful
  Click to reply to this thread Reply
Because you are using line breaks, and the box does not need to be wider to accommodate the content. Use "width" instead of "max-width" if you'd like to force the 100% width.
Merlin2504

Posts: 333
Registered: 25-Jul-2016
Re: change width
Posted: 11 Jun 22, 16:32   in response to: Laza in response to: Laza
 
  Click to reply to this thread Reply
Thanks, now the desktop version works. The mobile view probably doesn't go wider?
Legend
Forum admins
Helpful Answer
Correct Answer

Point your RSS reader here for a feed of the latest messages in all forums