The Facebook Like button and Twitter Follow button are not displaying in line on iOS browsers such as Chrome and Safari

When you go to: and resize your viewport to around 400px, click the down arrow next to O&O&O&O. The Twitter and Facebook buttons will be seen on the same line.

However, if you repeat the same process on Safari or Chrome for iOS, you'll notice that the Facebook Like button appears on a new line below the Twitter button.

Both elements have 'display:inline-block !important;' assigned to them.

Unfortunately, I don't have access to Safari 6 for debugging remotely.

I am looking to figure out how to ensure that the Facebook and Twitter buttons are on the same line on iOS. Any assistance is greatly appreciated.

Thank you, Thomas.

ioscssfacebook

Answer №1

By applying position:relative; and width:auto !important; to both components, the issue appeared to be resolved. However, it's likely that only adding it to the Facebook Like button was necessary.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What could be causing my div to display a horizontal scrollbar in Firefox?

Here's a straightforward test scenario: <html> <body> <div style="border:2px solid black; overflow: auto;"> x </div> </body> </html> Upon rendering, a horizontal scrollbar appears! I was using F ...

htmlcsslinuxfirefox

When using the HTML code <p></p>, the empty paragraph tag does not create a line break

We have a .NET application that saves messages in axml format. Our task is to convert these messages into html. After some research, I came across a 3rd party library called "HtmlFromXamlConverter" that does this job, but with one issue: when the axml cont ...

htmlcss

A guide on enabling the pan gesture for the tableview in ZUUIRevealController

The issue here is that the navigation bar in ZUUIRevealController can respond to pan gestures, but there is a desire to have the entire screen of frontViewController respond to pan gestures like in Path2. To achieve this, the following code was implemented ...

iphoneios

Is there a way to verify if a CLLocationCoordinate2D object is empty?

What is the best way to verify that a CLLocationCoordinate2D object is not empty? ...

ioscllocation

Learn how to implement Bootstrap 4's select styling to customize dropdown links, such as using it for a tags

My goal is to apply Bootstrap 4 form styling, like form-control and custom-select, to actual links (dropdown a tag). For example: <select class="custom-select" onchange="location = this.value;"> <option selected>Cho ...

javascripthtmljquerycssbootstrap-4

Ways to correct inverted text in live syntax highlighting using javascript

My coding script has a highlighting feature for keywords, but unfortunately, it is causing some unwanted effects like reversing and mixing up the text. I am seeking assistance to fix this issue, whether it be by un-reversing the text, moving the cursor to ...

javascripthtmlcsstextinnerhtml

Make toggleClass show up smoothly without disappearing

I'm currently working with jQuery's toggleClass() method and I want to achieve a fade-in effect without the corresponding fade-out animation. Using the "duration" attribute applies the same duration for both actions, which is not what I want. I w ...

javascriptjqueryhtmlcss

Clickable links and compliant W3C coding

Recently, I have encountered errors in the W3C validator due to the presence of "name" attributes in some <a> tags in my document. The validator flagged these attributes as obsolete. I am curious to know when and why this happened? Additionally, I n ...

htmlcssw3c

What is preventing npm sass from compiling properly?

https://i.stack.imgur.com/ekbNW.png While making edits to my code, I've noticed that the sass-compiler isn't indicating any errors (red lines) or successful compilations (green lines). Can someone help me identify where I might be going wrong? ...

htmlcssnpmsass

What is the best way to ensure a container adjusts perfectly to its contents without constraining the contents to their minimum width?

Imagine you have a div with a flexible width (like min-width 200px and max-width 1000px). Let's refer to this div as Div1. The goal is to enclose this div in a parent div that adjusts its size to fit Div1 without impacting Div1's width whatsoever ...

htmlcss

Error with Empty or Null Input Data in Alamofire

Every time I try to click on the register button after filling out all the necessary fields, I encounter an error message. Being new to swift and XCode, I found it challenging to find a solution to this problem. The variable *URL_USER_REGISTER* stores the ...

phpiosswiftalamofireregistration

How do I transfer a PDF or DOC file from one iOS app to another?

When trying to share a PDF file from APP1 using the share extension function, I was only able to retrieve a URL path from the method loadItemForTypeIdentifier. This URL path is located in the sandbox of APP1 and I am unable to access the PDF file directly ...

iosios8-share-extension

What is the best way to showcase two div elements side by side within my carousel

/* Implementing slideshow functionality */ var currentIndex = 0; displaySlides(); function displaySlides() { var i; var slides = document.getElementsByClassName("mySlides"); var dots = document.getElementsByClassName("dot"); for (i = 0; i ...

javascriptjqueryhtmlcss

The accessoryView in the UITableViewCell is not showing up as expected

I am facing an issue with my accessory view not displaying properly. I want to have text appear on both the right and left sides of a UITableViewCell, but currently only the text on the left is showing up. - (UITableViewCell *)tableView:(UITableView *)tab ...

iosuitableviewcocoa-touchaccessoryview

What is the best way to utilize "First Responder" in a xib file?

Learning about responder chains has opened my eyes to how events from the UI are passed up through the chain, allowing for handling and passing them along. While I have utilized -becomeFirstResponder and -resignFirstResponder for basic tasks like displayin ...

iphoneobjective-ciosfirst-responder

Is it acceptable to utilize display:none in order to generate multiple CSS navigation bars for a responsive website?

I designed a CSS navbar that looks great on larger screens, but unfortunately it doesn't reflow well on mobile devices. One solution I thought of was to create a separate, mobile-friendly navbar and position it on top of the desktop version while hidi ...

htmlcssresponsive-design

Combining Text in HTML Using CSS to Create Layered Effects

Link to GitHub: http://github.com/user123/code I'm attempting to position "welcome" behind "home", but I've been struggling to achieve this. I've experimented with setting the position, but so far I haven't been successful. Here' ...

css

Loading game data ahead of time using Objective-C and SpriteKit

One feature of my game is the "Choose Level" function, allowing users to select the level they want to play. To implement this function, I load all the levels' information and display them in a scrolling slideshow. However, after clicking "Choose Lev ...

iosobjective-csprite-kitgame-enginepreload

Is there a way to adjust the background color of the clicked tab with divs and revert the others back to their original color?

<span class="row top-bar-left align-items-center" style="width: 80%; float:left"> <div tabindex="1" class="link tab" routerLink="details" routerLinkActive="active" [qu ...

htmlcssangular

Finding the Perfect Placement for an Element in Relation to its Companion

Is there a way to achieve an effect similar to Position Relative in CSS using jQuery? I have developed a tooltip that I want to attach to various objects like textboxes, checkboxes, and other text elements. My code looks something like this: <input i ...

javascriptjqueryhtmlcss