I'm using a copy of the Oslo master page with some custom css for branding. Now I'm trying to move the search box towards the center of the page, positioning it directly after the top navigation bar. No matter what I do, however, the search box is sticked to the far right of the screen. Does anyone have a solution for how to accomplish this?
I'm still a SP newbie and having a hard time wrapping my head around how the master page and it's default css-classes play together with my custom css. Any help would be appreciated.
<div id="titlerow" class="ms-dialogHidden ms-core-header ms-tableRow">
<div id="titleAreaBox" class="ms-noList ms-table">
<div id="titleAreaRow" class="ms-tableRow">
<div id="siteIcon" class="ms-tableCell ms-verticalAlignBottom">
<!--CS: Start Site Logo Snippet-->
<!--MS:<SharePoint:AjaxDelta id="DeltaSiteLogo" BlockElement="true" runat="server">-->
<!--MS:<SharePoint:SPSimpleSiteLink CssClass="ms-siteicon-a" runat="server" id="onetidProjectPropertyTitleGraphic">-->
<!--MS:<SharePoint:SiteLogoImage CssClass="ms-siteicon-img" name="onetidHeadbnnr0" id="onetidHeadbnnr2" LogoImageUrl="/_layouts/15/images/siteIcon.png?rev=23" runat="server">-->
<!--PS: Start of READ-ONLY PREVIEW (do not modify)--><img id="ctl00_onetidHeadbnnr2" class="ms-siteicon-img" name="onetidHeadbnnr0" Src="http://sptst01global.beijerelectronics.com/_layouts/15/images/siteIcon.png?rev=23" alt="Content site" /><!--PE: End of READ-ONLY PREVIEW-->
<!--ME:</SharePoint:SiteLogoImage>-->
<!--ME:</SharePoint:SPSimpleSiteLink>-->
<!--ME:</SharePoint:AjaxDelta>-->
<!--CE:End Site Logo Snippet-->
</div>
<div class="ms-breadcrumb-box ms-tableCell ms-verticalAlignBottom">
<h1 id="pageTitle" class="ms-core-pageTitle">
<!--SPM:<SharePoint:AjaxDelta id="DeltaPlaceHolderPageSiteName" class="ms-core-navigation" runat="server">-->
<!--SPM:<asp:ContentPlaceHolder id="PlaceHolderSiteName" runat="server">-->
<!--SPM:<SharePoint:SPLinkButton runat="server" NavigateUrl="~site/" id="onetidProjectPropertyTitle1">-->
<!--SPM:<SharePoint:ProjectProperty Property="Title" runat="server"/>-->
<!--PS: Start of READ-ONLY PREVIEW (do not modify)-->Default Publishing Site<!--PE: End of READ-ONLY PREVIEW-->
<!--SPM:</SharePoint:SPLinkButton>-->
<!--SPM:</asp:ContentPlaceHolder>-->
<!--SPM:</SharePoint:AjaxDelta>-->
</h1>
<!--SPM:<SharePoint:AjaxDelta id="DeltaHorizontalQuickLaunch" class="ms-core-navigation ms-belltown-quicklaunch" role="navigation" BlockElement="true" runat="server">-->
<div class="ms-quicklaunchouter">
<div class="ms-quickLaunch">
<!--PS: Start of READ-ONLY PREVIEW (do not modify) --><div><div class="noindex ms-core-listMenu-horizontalBox"><ul class="root ms-core-listMenu-root static"><li class="static selected"><span class="ms-core-listMenu-horizSeparator">|</span><a class="static selected menu-item ms-core-listMenu-item ms-displayInline ms-core-listMenu-selected ms-navedit-linkNode" tabIndex="0" href="#"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Home</span><span class="ms-hidden">Currently selected</span></span></a></li><li class="static"><span class="ms-core-listMenu-horizSeparator">|</span><a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" tabIndex="0" href="#"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">About Us</span></span></a></li><li class="static"><span class="ms-core-listMenu-horizSeparator">|</span><a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" tabIndex="0" href="#"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Contact Us</span></span></a></li><li class="static"><span class="ms-core-listMenu-horizSeparator">|</span><a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" tabIndex="0" href="#"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Directions</span></span></a></li></ul></div></div><!--PE: End of READ-ONLY PREVIEW -->
<!--SPM:<Sharepoint:SPNavigationManager id="QuickLaunchNavigationManager" runat="server" QuickLaunchControlId="V4QuickLaunchMenu" ContainedControl="QuickLaunch" EnableViewState="false">-->
<!--SPM:<SharePoint:DelegateControl runat="server" ControlId="QuickLaunchDataSource">-->
<!--SPM:<Template_Controls>-->
<!--SPM:<asp:SiteMapDataSource SiteMapProvider="SPNavigationProvider" ShowStartingNode="False" id="QuickLaunchSiteMap" StartingNodeUrl="sid:1025" runat="server"/>-->
<!--SPM:</Template_Controls>-->
<!--SPM:</SharePoint:DelegateControl>-->
<!--SPM:<SharePoint:AspMenu id="V4QuickLaunchMenu" runat="server" EnableViewState="false" DataSourceId="QuickLaunchSiteMap" UseSimpleRendering="true" Orientation="Horizontal" StaticDisplayLevels="1" DynamicHorizontalOffset="0" AdjustForShowStartingNode="true" MaximumDynamicDisplayLevels="2" StaticPopoutImageUrl="/_layouts/15/images/menudark.gif?rev=23" StaticPopoutImageTextFormatString="" SkipLinkText="" StaticSubMenuIndent="0"/>-->
<!--SPM:</Sharepoint:SPNavigationManager>-->
</div>
</div>
</div>
<div class="ms-tableCell ms-verticalAlignTop">
<!--SPM:<SharePoint:AjaxDelta id="DeltaPlaceHolderPageHeader" class="ms-belltown-pageheader" BlockElement="true" runat="server">-->
<!--SPM:<SharePoint:DelegateControl runat="server" ControlId="PageHeader" AllowMultipleControls="false"/>-->
<!--SPM:</SharePoint:AjaxDelta>-->
<!--SPM:<SharePoint:AjaxDelta id="DeltaPlaceHolderSearchArea" class="ms-belltown-searcharea" BlockElement="true" runat="server">-->
<!--PS: Start of READ-ONLY PREVIEW (do not modify)--><div class="ms-belltown-searcharea" id="ctl00_DeltaPlaceHolderSearchArea"><!--PE: End of READ-ONLY PREVIEW-->
<div class="ms-pub-logon">
<!--SPM:<wssucw:Welcome id="IdOsloWelcome" runat="server" EnableViewState="false"/>-->
</div>
<!--SPM:<asp:ContentPlaceHolder id="PlaceHolderSearchArea" runat="server">-->
<div id="searchInputBox" class="ms-tableCell">
<!--SPM:<SharePoint:DelegateControl runat="server" ControlId="SmallSearchInputBox"/>-->
<!--PS: Start of READ-ONLY PREVIEW (do not modify)--><div class="ms-webpart-chrome "><div WebPartID="00000000-0000-0000-0000-000000000000" HasPers="true" id="WebPart" width="100%" class="ms-WPBody noindex " OnlyForMePart="true" allowDelete="false" style=""><div componentid="ctl00_SmallSearchInputBox1_csr" id="ctl00_SmallSearchInputBox1_csr"><div id="SearchBox" name="Control"><div class="ms-srch-sb ms-srch-sb-border" id="ctl00_SmallSearchInputBox1_csr_sboxdiv"><input type="text" value="Search This Site..." maxlength="2048" accessKey="S" title="Search This Site..." id="ctl00_SmallSearchInputBox1_csr_sbox" autocomplete="off" autocorrect="off" class="ms-srch-sb-prompt ms-helperText" /><a title="Search" class="ms-srch-sb-searchLink" id="ctl00_SmallSearchInputBox1_csr_SearchLink" href="javascript: {}"><img src="http://sptst01global.beijerelectronics.com/_layouts/15/images/searchresultui.png" class="ms-srch-sb-searchImg" id="searchImg" alt="Search" /></a></div></div></div><div componentid="ctl00_SmallSearchInputBox1_csr" id="ctl00_SmallSearchInputBox1_csr"></div><div id="ctl00_SmallSearchInputBox1"></div><div class="ms-clear"></div></div></div><!--PE: End of READ-ONLY PREVIEW-->
</div>
<!--SPM:</asp:ContentPlaceHolder>-->
<!--SPM:</SharePoint:AjaxDelta>-->
<!--PS: Start of READ-ONLY PREVIEW (do not modify)--></div><!--PE: End of READ-ONLY PREVIEW-->
<!--SPM:</SharePoint:AjaxDelta>-->
</div>
</div>
</div>
</div>
