Styjun

Did the Ottoman empire suppress the printing press?

Why would people still be chanting "Lock her up" at Trump rallies in 2019?

When I press the space bar it deletes the letters in front of it

Is a request to book a business flight ticket for a graduate student an unreasonable one?

What attributes and how big would a sea creature(s) need to be able to tow a ship?

Why weren't bootable game disks ever a thing on the IBM PC?

Is it okay to roll multiple attacks that all have advantage in one cluster?

What is the correct parsing of お高くとまる?

What is a "Lear Processor" and how did it work?

Data Encryption by Application vs Data Encryption in Database

Why did Old English lose both thorn and eth?

Would it be appropriate to sand a floor between coats of poly with a handheld orbital sander?

Received a dinner invitation through my employer's email, is it ok to attend?

Found and corrected a mistake on someone's else paper -- praxis?

Yet another hash table in C

What's the point of having a RAID 1 configuration over incremental backups to a secondary drive?

Credit score and financing new car

What minifigure is this?

Why different specifications for telescopes and binoculars?

What is the right approach to quit a job during probation period for a competing offer?

What happens when adult Billy Batson says "Shazam"?

Addressing unnecessary daily meetings with manager?

Through: how to use it with subtraction of functions?

Postgres trigram match acting strange for specific characters

Question to the width parameter: Website (via tumblr) is not on 100% on mobile devices

What is the best way to detect a mobile device?Optimizing website for mobile devicesWidth: 100% not filling up screen on mobile devicesIE8 issue with Twitter Bootstrap 3Should I use max-device-width or max-width?Meta viewport and width=device-width vs. percent dimentionsdiv wont fill 100% width on mobile Chrome/Safari BrowserChanging positioning of elements depending on user screen size. How do I stack these elements for mobile devices?How to change wordpress website Page width on Mobile device?Infinite scrolling tumblr embedded in iframe not working properly on mobile

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;

0

This tumblr (johannesjakobi.tk) that I use as a website, works good on desktop-webbrowsers but on mobile devices the main elements do not have the desired wide range (of filling out the screen by ideally 95%). Is it a problem with any "width"-parameter?

This is how it looks on mobile google- and safari-browser.

Thank you a lot for your knowledge!

css html5 mobile tumblr

share|improve this question

asked Mar 26 at 0:54

ponzoh-ohponzoh-oh

6

add a comment | 

0

This tumblr (johannesjakobi.tk) that I use as a website, works good on desktop-webbrowsers but on mobile devices the main elements do not have the desired wide range (of filling out the screen by ideally 95%). Is it a problem with any "width"-parameter?

This is how it looks on mobile google- and safari-browser.

Thank you a lot for your knowledge!

css html5 mobile tumblr

share|improve this question

asked Mar 26 at 0:54

ponzoh-ohponzoh-oh

6

add a comment | 

This tumblr (johannesjakobi.tk) that I use as a website, works good on desktop-webbrowsers but on mobile devices the main elements do not have the desired wide range (of filling out the screen by ideally 95%). Is it a problem with any "width"-parameter?

This is how it looks on mobile google- and safari-browser.

Thank you a lot for your knowledge!

css html5 mobile tumblr

share|improve this question

asked Mar 26 at 0:54

ponzoh-ohponzoh-oh

6

share|improve this question

asked Mar 26 at 0:54

ponzoh-ohponzoh-oh

6

share|improve this question

asked Mar 26 at 0:54

ponzoh-ohponzoh-oh

6

asked Mar 26 at 0:54

ponzoh-ohponzoh-oh

6

asked Mar 26 at 0:54

ponzoh-ohponzoh-oh

6

1 Answer
1

active

oldest

votes

0

I think the issue is your navigation. The images seem to be resizing to the viewport width.

For the navigation, I would either implement this:

#top nav a 
 display: inline-block;

Or if you just want it for a particular media query snap point:

@media (max-width: 600px) 
 #top nav a 
 display: inline-block;
 

Or you can change the display property to block. This will create each anchor as a block element with 100% width. I've also added text align left (I would only implement this for mobile, as otherwise it would stack your navigation on top of each other which makes much less sense on desktop).

@media (max-width: 600px) 
 #top nav a 
 display: block;
 text-align: left;
 

See attached images for reference.

share|improve this answer

edited Mar 27 at 10:37

answered Mar 26 at 22:40

lharbylharby

2,39144 gold badges1414 silver badges4646 bronze badges

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  Thank you a lot, lharby! I will try that next week! Sadly I can not vote yet. But your comment seems to be helpful!
  
  – ponzoh-oh
  Mar 28 at 16:48
  
  

  
  
  
  

add a comment | 

Your Answer

StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55348393%2fquestion-to-the-width-parameter-website-via-tumblr-is-not-on-100-on-mobile-d%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

0

I think the issue is your navigation. The images seem to be resizing to the viewport width.

For the navigation, I would either implement this:

#top nav a 
 display: inline-block;

Or if you just want it for a particular media query snap point:

@media (max-width: 600px) 
 #top nav a 
 display: inline-block;
 

Or you can change the display property to block. This will create each anchor as a block element with 100% width. I've also added text align left (I would only implement this for mobile, as otherwise it would stack your navigation on top of each other which makes much less sense on desktop).

@media (max-width: 600px) 
 #top nav a 
 display: block;
 text-align: left;
 

See attached images for reference.

share|improve this answer

edited Mar 27 at 10:37

answered Mar 26 at 22:40

lharbylharby

2,39144 gold badges1414 silver badges4646 bronze badges

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  Thank you a lot, lharby! I will try that next week! Sadly I can not vote yet. But your comment seems to be helpful!
  
  – ponzoh-oh
  Mar 28 at 16:48
  
  

  
  
  
  

add a comment | 

0

I think the issue is your navigation. The images seem to be resizing to the viewport width.

For the navigation, I would either implement this:

#top nav a 
 display: inline-block;

Or if you just want it for a particular media query snap point:

@media (max-width: 600px) 
 #top nav a 
 display: inline-block;
 

Or you can change the display property to block. This will create each anchor as a block element with 100% width. I've also added text align left (I would only implement this for mobile, as otherwise it would stack your navigation on top of each other which makes much less sense on desktop).

@media (max-width: 600px) 
 #top nav a 
 display: block;
 text-align: left;
 

See attached images for reference.

share|improve this answer

edited Mar 27 at 10:37

answered Mar 26 at 22:40

lharbylharby

2,39144 gold badges1414 silver badges4646 bronze badges

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  Thank you a lot, lharby! I will try that next week! Sadly I can not vote yet. But your comment seems to be helpful!
  
  – ponzoh-oh
  Mar 28 at 16:48
  
  

  
  
  
  

add a comment | 

I think the issue is your navigation. The images seem to be resizing to the viewport width.

For the navigation, I would either implement this:

#top nav a 
 display: inline-block;

Or if you just want it for a particular media query snap point:

@media (max-width: 600px) 
 #top nav a 
 display: inline-block;
 

Or you can change the display property to block. This will create each anchor as a block element with 100% width. I've also added text align left (I would only implement this for mobile, as otherwise it would stack your navigation on top of each other which makes much less sense on desktop).

@media (max-width: 600px) 
 #top nav a 
 display: block;
 text-align: left;
 

See attached images for reference.

share|improve this answer

edited Mar 27 at 10:37

answered Mar 26 at 22:40

lharbylharby

2,39144 gold badges1414 silver badges4646 bronze badges

#top nav a 
 display: inline-block;

@media (max-width: 600px) 
 #top nav a 
 display: inline-block;
 

@media (max-width: 600px) 
 #top nav a 
 display: block;
 text-align: left;
 

share|improve this answer

edited Mar 27 at 10:37

answered Mar 26 at 22:40

lharbylharby

2,39144 gold badges1414 silver badges4646 bronze badges

answered Mar 26 at 22:40

lharbylharby

2,39144 gold badges1414 silver badges4646 bronze badges

answered Mar 26 at 22:40

lharbylharby

2,39144 gold badges1414 silver badges4646 bronze badges