liv_acook, were you ever able to make this work?
Hello,
I am currently integrating a Microsoft Bookings page into a WordPress page using an iFrame and the Microsoft Bookings embed code.
I am trying to change a couple things:
Force a word wrap (we have a questionnaire built into our booking page, and one of the questions is a little lengthly, and the text just runs right off the frame). I have identified the specific class I need to change using browser inspect tool and can modify it there, but when I modify that class in the custom css in wordpress is does nothing. I've tried copying the full selector from inspect too as well.
Class needing changing: .WpLer, I want to change the white-space: nowrap to white-space: normal. owa.BookingsC2Boot.css is the style sheet it's referencing.
Change max-width (the Microsoft Bookings app max width is less than my page inner max width, leaving unnecessary spacing on either side of the booking form. Again, can change this in browser inspect but not in Wordpress custom css.
Class needing changing: .Qkr3P, I want to change to max-width: 1024px to max-width: 1250px.
Is there any way to override these settings??
Thanks.
Andrea
","kudosSumWeight":1,"postTime":"2023-09-08T09:30:53.945-07:00","images":{"__typename":"AssociatedImageConnection","edges":[],"totalCount":0,"pageInfo":{"__typename":"PageInfo","hasNextPage":false,"endCursor":null,"hasPreviousPage":false,"startCursor":null}},"attachments":{"__typename":"AttachmentConnection","pageInfo":{"__typename":"PageInfo","hasNextPage":false,"endCursor":null,"hasPreviousPage":false,"startCursor":null},"edges":[]},"tags":{"__typename":"TagConnection","pageInfo":{"__typename":"PageInfo","hasNextPage":false,"endCursor":null,"hasPreviousPage":false,"startCursor":null},"edges":[{"__typename":"TagEdge","cursor":"MjUuM3wyLjF8b3wxMHxfTlZffDE","node":{"__typename":"Tag","id":"tag:Office 365 Booking","text":"Office 365 Booking","time":"2018-04-10T11:02:46.304-07:00","lastActivityTime":null,"messagesCount":null,"followersCount":null}},{"__typename":"TagEdge","cursor":"MjUuM3wyLjF8b3wxMHxfTlZffDI","node":{"__typename":"Tag","id":"tag:wordpress","text":"wordpress","time":"2018-09-05T14:04:49.895-07:00","lastActivityTime":null,"messagesCount":null,"followersCount":null}}]},"timeToRead":1,"currentRevision":{"__ref":"Revision:revision:3922355_1"},"latestVersion":null,"metrics":{"__typename":"MessageMetrics","views":1415},"visibilityScope":"PUBLIC","canonicalUrl":null,"seoTitle":null,"seoDescription":null,"isEscalated":null,"placeholder":false,"originalMessageForPlaceholder":null,"messagePolicies":{"__typename":"MessagePolicies","canModerateSpamMessage":{"__typename":"PolicyResult","failureReason":{"__typename":"FailureReason","message":"error.lithium.policies.feature.moderation_spam.action.moderate_entity.allowed.accessDenied","key":"error.lithium.policies.feature.moderation_spam.action.moderate_entity.allowed.accessDenied","args":[]}}},"archivalData":null,"customFields":[],"body":"Hello,
I am currently integrating a Microsoft Bookings page into a WordPress page using an iFrame and the Microsoft Bookings embed code.
I am trying to change a couple things:
Force a word wrap (we have a questionnaire built into our booking page, and one of the questions is a little lengthly, and the text just runs right off the frame). I have identified the specific class I need to change using browser inspect tool and can modify it there, but when I modify that class in the custom css in wordpress is does nothing. I've tried copying the full selector from inspect too as well.
Class needing changing: .WpLer, I want to change the white-space: nowrap to white-space: normal. owa.BookingsC2Boot.css is the style sheet it's referencing.
Change max-width (the Microsoft Bookings app max width is less than my page inner max width, leaving unnecessary spacing on either side of the booking form. Again, can change this in browser inspect but not in Wordpress custom css.
Class needing changing: .Qkr3P, I want to change to max-width: 1024px to max-width: 1250px.
Is there any way to override these settings??
Thanks.
Andrea
"},"Conversation:conversation:3922355":{"__typename":"Conversation","id":"conversation:3922355","solved":false,"topic":{"__ref":"ForumTopicMessage:message:3922355"},"lastPostingActivityTime":"2025-04-07T08:34:33.694-07:00","lastPostTime":"2025-04-07T08:34:33.694-07:00","unreadReplyCount":2,"isSubscribed":false},"ModerationData:moderation_data:3922355":{"__typename":"ModerationData","id":"moderation_data:3922355","status":"APPROVED","rejectReason":null,"isReportedAbuse":false,"rejectUser":null,"rejectTime":null,"rejectActorType":null},"Revision:revision:3922355_1":{"__typename":"Revision","id":"revision:3922355_1","lastEditTime":"2023-09-08T09:30:53.945-07:00"},"ForumReplyMessage:message:4401632":{"__typename":"ForumReplyMessage","id":"message:4401632","conversation":{"__ref":"Conversation:conversation:3922355"},"author":{"__ref":"User:user:2922081"},"revisionNum":1,"uid":4401632,"depth":1,"hasGivenKudo":false,"subscribed":false,"board":{"__ref":"Forum:board:MicrosoftBookings"},"subject":"Re: Customize Microsoft Bookings embedded Booking page with specific css styles","readOnly":false,"editFrozen":false,"moderationData":{"__ref":"ModerationData:moderation_data:4401632"},"parent":{"__ref":"ForumTopicMessage:message:3922355"},"body":"liv_acook, were you ever able to make this work?
","body@stringLength":"246","rawBody":"
