Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

CSS help needed - Spacing, Formatting

Posted on 2014-03-30
4
Medium Priority
?
646 Views
Last Modified: 2014-04-04
Hi All,
I need some css help.. I have been going around in circles on trying to get this to be closer grouped as my "Desired View" pic shows.

ExistingView.pdf

DesiredView.pdf

Oracle APEX is a tool that creates the layout based on some limited dev input so I am showing two chuncks that I can start from, if one is easier than the other.

And so far I am using
div.fieldContainer{
  float: left;
  margin-bottom: 0px;
  margin-top: 5px;
}
label.uOptional {
  width: 5%;
}

#P10_SEARCH_BTN {
  margin: 5px;
}

Open in new window


	  <div class="uButtonRegionContentContainer">
	      <div class="uButtonRegionContent"><div class="apex_row">
	  <div class="apex_cols apex_span_4 alpha">
	  <div class="fieldContainer horizontal rightlabels" id="P10_INVOICE_FROM_DATE_CONTAINER"><label for="P10_INVOICE_FROM_DATE" class="uOptional">Invoice From Date</label>
	  <div class="fieldControls"><input type="hidden" name="p_arg_names" value="6446728547348225"><input type="text" class="datepicker hasDatepicker" id="P10_INVOICE_FROM_DATE" name="p_t01" maxlength="14" size="8" value="01-07-2008" autocomplete="off"><img class="ui-datepicker-trigger" src="/i/asfdcldr.gif" alt="Popup Calendar: Invoice From Date" title="Popup Calendar: Invoice From Date"><a class="eLink" title="Edit" href="javascript:apex.navigation.popup.url('f?p=4000:371:4396537762962:::371:P371_ID,FB_FLOW_ID,FB_FLOW_PAGE_ID:6446728547348225,777,10');"><img src="/i/e.gif" alt="Edit" class="eLink"></a>
	  <span class="uItemHelp" data-item-id="P10_INVOICE_FROM_DATE"></span>
	  </div>
	  </div>
	  </div><div class="apex_cols apex_span_4 ">
	  <div class="fieldContainer horizontal rightlabels" id="P10_INVOICE_TO_DATE_CONTAINER"><label for="P10_INVOICE_TO_DATE" class="uOptional">To Date</label>
	  <div class="fieldControls"><input type="hidden" name="p_arg_names" value="6446921215351609"><input type="text" class="datepicker hasDatepicker" id="P10_INVOICE_TO_DATE" name="p_t02" maxlength="14" size="8" value="01-22-2008" autocomplete="off"><img class="ui-datepicker-trigger" src="/i/asfdcldr.gif" alt="Popup Calendar: To Date" title="Popup Calendar: To Date"><a class="eLink" title="Edit" href="javascript:apex.navigation.popup.url('f?p=4000:371:4396537762962:::371:P371_ID,FB_FLOW_ID,FB_FLOW_PAGE_ID:6446921215351609,777,10');"><img src="/i/e.gif" alt="Edit" class="eLink"></a>
	  <span class="uItemHelp" data-item-id="P10_INVOICE_TO_DATE"></span>
	  </div>
	  </div>
	  </div><div class="apex_cols apex_span_4 omega">
	  <button class="uButton uHotButton " onclick="apex.submit('P10_SEARCH_BTN');" id="P10_SEARCH_BTN" type="button"><span>Filter</span></button> <a class="eLink" title="Edit" href="javascript:apex.navigation.popup.url('f?p=4000:372:4396537762962:::372:P372_ID,FB_FLOW_ID,FB_FLOW_PAGE_ID:6451510162618842,777,10');"><img src="/i/e.gif" alt="Edit" class="eLink"></a>
	  </div>
	  </div></div>
	      <span class="uButtonContainer">

	      </span>
	  </div>

Open in new window


OR

<div class="uButtonRegionContentContainer">
    <div class="uButtonRegionContent"><div class="fieldContainer horizontal rightlabels" id="P10_INVOICE_FROM_DATE_CONTAINER"><label for="P10_INVOICE_FROM_DATE" class="uOptional">Invoice From Date</label>
<div class="fieldControls"><input type="hidden" name="p_arg_names" value="6446728547348225"><input type="text" class="datepicker hasDatepicker" id="P10_INVOICE_FROM_DATE" name="p_t01" maxlength="14" size="8" value="01-07-2008" autocomplete="off"><img class="ui-datepicker-trigger" src="/i/asfdcldr.gif" alt="Popup Calendar: Invoice From Date" title="Popup Calendar: Invoice From Date"><a class="eLink" title="Edit" href="javascript:apex.navigation.popup.url('f?p=4000:371:4396537762962:::371:P371_ID,FB_FLOW_ID,FB_FLOW_PAGE_ID:6446728547348225,777,10');"><img src="/i/e.gif" alt="Edit" class="eLink"></a>
<span class="uItemHelp" data-item-id="P10_INVOICE_FROM_DATE"></span>
</div>
</div><div class="fieldContainer horizontal rightlabels" id="P10_INVOICE_TO_DATE_CONTAINER"><label for="P10_INVOICE_TO_DATE" class="uOptional">To Date</label>
<div class="fieldControls"><input type="hidden" name="p_arg_names" value="6446921215351609"><input type="text" class="datepicker hasDatepicker" id="P10_INVOICE_TO_DATE" name="p_t02" maxlength="14" size="8" value="01-22-2008" autocomplete="off"><img class="ui-datepicker-trigger" src="/i/asfdcldr.gif" alt="Popup Calendar: To Date" title="Popup Calendar: To Date"><a class="eLink" title="Edit" href="javascript:apex.navigation.popup.url('f?p=4000:371:4396537762962:::371:P371_ID,FB_FLOW_ID,FB_FLOW_PAGE_ID:6446921215351609,777,10');"><img src="/i/e.gif" alt="Edit" class="eLink"></a>
<span class="uItemHelp" data-item-id="P10_INVOICE_TO_DATE"></span>
</div>
</div><button class="uButton uHotButton " onclick="apex.submit('P10_SEARCH_BTN');" id="P10_SEARCH_BTN" type="button"><span>Filter</span></button> <a class="eLink" title="Edit" href="javascript:apex.navigation.popup.url('f?p=4000:372:4396537762962:::372:P372_ID,FB_FLOW_ID,FB_FLOW_PAGE_ID:6451510162618842,777,10');"><img src="/i/e.gif" alt="Edit" class="eLink"></a></div>
    <span class="uButtonContainer">

    </span>
  </div>

Open in new window


Thank you very much,
Bill
0
Comment
Question by:bcarlis
  • 2
4 Comments
 
LVL 5

Assisted Solution

by:Neil_Bradley
Neil_Bradley earned 600 total points
ID: 39965425
Bill,
can you post us a link to your work in progress page?
N
0
 
LVL 53

Accepted Solution

by:
COBOLdinosaur earned 600 total points
ID: 39966586
So the tool gives you a problem generating code that should take 5 minutes to write, test and deploy if it was written directly and you want a workaround so you can continue to use it???!!!???

The code you posted is not much help without the rules for the classes be referenced, and the code around the fragment, may also contribute to the problem or inhibit a simple solution.

So if you do as Neil requested and post a link we may have a solution to either fix the junk generated by the tool or direct code the goes around the roadblocks it is throwing up.

Cd&
0
 
LVL 2

Author Comment

by:bcarlis
ID: 39966617
Well, I guess I will have to accept what I can do with it... I can not post a link because it goes to our EBS server and it is internal.

Thanks anyway,
Bill
0
 
LVL 2

Author Closing Comment

by:bcarlis
ID: 39978798
thank for trying
0

Featured Post

Windows Server 2016: All you need to know

Learn about Hyper-V features that increase functionality and usability of Microsoft Windows Server 2016. Also, throughout this eBook, you’ll find some basic PowerShell examples that will help you leverage the scripts in your environments!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This post first appeared at Oracleinaction  (http://oracleinaction.com/undo-and-redo-in-oracle/)by Anju Garg (Myself). I  will demonstrate that undo for DML’s is stored both in undo tablespace and online redo logs. Then, we will analyze the reaso…
The first step to building an amazing About page is to figure out what you want the page to say about your company. You then must grab the attention of the reader, boast a bit, tell a story and let others brag about you. With a little bit of thought…
Video by: Steve
Using examples as well as descriptions, step through each of the common simple join types, explaining differences in syntax, differences in expected outputs and showing how the queries run along with the actual outputs based upon a simple set of dem…
Via a live example, show how to take different types of Oracle backups using RMAN.
Suggested Courses

879 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question