Using boxes to place images at the top of page

I'm trying to place 2 logos using boxes at the far left and far right top of my web page. I haven't places the image within them yet as I'm just trying to get the placement right first. Even though I have the code there the boxes are not appearing on the page and I'm not sure why?
https://www.rda-ddsw.org.au/test/index.html

Copy and paste the following markup into a new document and view in your favourite browser
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
body {
    width: 960px;
    margin: auto;
    background: #F0F9FF;
header {
nav {
    position: relative;
    width: 900px; /**adjust width as needed**/
    margin: 0 auto;
    padding: 20px;
    text-align: center;
nav ul {
    margin: 0;
    padding: 0;
nav li {
    list-style: none;
    font-size: 12px;
    float: left;
    text-align: center;
/**top level menu**/
nav li a {
    display: block;
    text-decoration: none;
    margin-right: 2px; /* space between links */
    width: auto; /* adjust as needed or use auto */
    padding: 10px;
    font-weight: bold;
    line-height: 1.50em;
    border-top: none;
    color: #FFFFFF;
/**alternating background colors**/
nav li:nth-child(odd) > a {
    background: #999
nav li:nth-child(even) > a {
    background: #999
/**top menu style on mouse over**/
nav li:hover > a {
color: #000 background: #CCCCCCC;
/**sub-menu**/
nav li ul {
    display: none;
    text-align: center;
    margin: 0;
    padding: 0 1em;
    background: none;
/**sub-menu, help for older IE**/
nav li:hover ul, nav li.hover ul {
    display: block;
    position: absolute;
    padding: 0;
nav li:hover li, nav li.hover li {
    float: none;
/**drop-menu style**/
nav li:hover li a, nav li.hover li a {
    width: auto; /* adjust width as needed or use auto */
    margin-top: 0;
/**drop-menu style on mouse over**/
nav li li a:hover {
    background: #CCCCCC;
    color: #999;
/* Clear floated elements at the end*/
nav:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
section {
    background: #EADCAE;
    overflow: hidden;
section aside {
    width: 180px;
    padding: 15px;
section aside img {
    width: 100%;
section article {
    background: #F0F9FF;
    width: 600px;
    float: left;
    padding: 15px;
footer {
    clear: both;
    height: 125px;
.left {
    float: left;
.right {
    float: right;
</style>
</head>
<body>
<header>
<nav>
    <li><a href="#">Home</a>
    <li> </li>
    <li><a href="#">About Us ▼</a>
      <ul>
        <li><a href="#">Committee</a></li>
        <li><a href="#">Newsletter</a></li>
      </ul>
    </li>
    <li><a href="#">Our Region ▼</a>
      <ul>
        <li><a href="#">Regional News</a></li>
        <li><a href="#">Announcements</a></li>
        <li><a href="#">Funding Availability</a></li>
        <li><a href="#">Events</a></li>
      </ul>
    </li>
    <li><a href="#">Research & Data ▼</a>
      <ul>
        <li><a href="#">Reports & Studies</a></li>
        <li><a href="#">Community Plans</a></li>
        <li><a href="#">Regional Plans</a></li>
        <li><a href="#">Regional Profiles</a></li>
      </ul>
    </li>
    <li><a href="#">Links ▼</a></li>
    </li>
    <li><a href="#">Downloads ▼</a>
      <ul>
        <li><a href="#">Reports & Studies</a></li>
        <li><a href="#">Community Plans</a></li>
        <li><a href="#">Regional Plans</a></li>
        <li><a href="#">Regional Profiles</a></li>
      </ul>
    </li>
    <li><a href="#">Contact Us</a>
      <ul>
      </ul>
</nav>
</header>
<section>
<aside class="left"> <img src="https://www.rda-ddsw.org.au/test/images/roadmap%20logo%20resize.png" alt=""> </aside>
<article>
<p>Regional Development Australia is a partnership between the Australian, State, Territory and Local Governments to develop and strengthen the regional communities of Australia. It will have a pivotal role in ensuring the long-term sustainability of Australia's regions. The focus will be on the economic, social and environmental issues that affect local communities. </p>
<p>Regional Development Australia - Darling Downs and South West (RDA - DD&SW) will consult with communities, business, non-profit organisations and all levels of government to articulate local priorities, identify and align resources, engage stakeholders and promote solutions that support the growth and development of our regional community. The Community Plans of the ten shires that we represent will play an integral part in identifying the priorities for the region.</p>
<p>A key focus of Regional Development Australia will be on the economic, social and environmental issues affecting communities. Regional Development Australia will be an important contributor to and driver of:</p>
<ul>
    <li>arrowRegional business growth plans and strategies, which will help support economic development, the creation of new jobs, skills development and business investment;</li>
    <li>arrowEnvironmental solutions, which will support ongoing sustainability and the management of climate change (including the impact of drought, flood or bushfires); and:</li>
    <li>arrowSocial inclusion strategies, which will bring together and support all members of the community.</li>
</ul>
<p>Regional Development Australia, in consultation with the community, business, non profit organisations and all levels of government, will articulate local priorities, identify and align resources, engage stakeholders and promote solutions. In doing this, Regional Development Australia will support the growth and development of regional communities across the country.</p>
<p>Regional Development Australia will support, promote and disseminate information on government policy initiatives for the benefit of local communities. To this end, Regional Development Australia committees and Chairs will have a strong understanding of federal, state and local government policies and initiatives, and the ways in which local communities can engage with them. Regional Development Australia will take a leadership role in bringing together organisations to take advantage of government programs, policies and initiatives.</p>
<p>Regional Development Australia will be an effective conduit between governments and regional communities. It will enable all communities to provide input to governments about the strengths and weaknesses of regional Australia. </p>
</article>
<aside class="right"> <img src="https://www.rda-ddsw.org.au/test/images/newspaper%20vertical%20resize.png" alt=""> </aside>
<footer>
    <img src="https://www.rda-ddsw.org.au/test/images/rda_footer resize.png" width="960" height="125" alt="footer" />
</footer>
</body>
</html>
Carn the Hawks!!!!

Similar Messages

For no apparent reason the top tool bar line has dissappeared and if i place mouse over the top of page, FireFox will come up but not "File" and now cannot find "Prinit". "History", etc. Help???

The tool bar line has suddenly disappeared and cannot print or check history. Also, bottom tool bar has disappeared so cannot see clock, shift to other programs.
Only happens with FireFox. If I access any www site via FireFox, same problem. I have re-booted several times, same problem.
MS 7 Prof OS
Dell Latitude

Upgrade your browser to Firefox 8 and check
* getfirefox.com

When i place my photo, the adjustments tab does not pop up, and even when i click image at the top, I cannot select any adjustments-brightness/contrast,hue-saturation, color blance, etc..Anyone know what I am doing wrong?

When i place my photo, the adjustments tab does not pop up, and even when i click image at the top, I cannot select any adjustments-brightness/contrast,hue-saturation, color blance, etc..Anyone know what I am doing wrong?

Good day!
What is "place" supposed to mean – open, place as Smart Object, …?
What are the image’s Color Mode and bit depth?
Could you please post a screenshot with the pertinent Panels visible?
Does Window > Adjustments not raise the Adjustments Panel?
Regards,
Pfaffenbichler

I can't change the image at the top of Table of Contents (portrait mode)

I can't seem to change the image at the top of the table of contents, when viewed in portrait mode. It remains the planet place holder. Can anyone tell me where to find where to drag and drop a more suitable image?
Thank you.

Sorry, but I don't. Have never used a TV as a monitor. My suggestion was just a thought. Perhaps someone else will have a workable solution.
If the menubar is visible then it may be some adjustment that's needed perhaps on the TV itself which has it's own zoom. If it's set to an incorrect screen mode then it may cut off portions of the display - just a guess. Try switching the display mode on the TV to see if that resolves the problem.
As for the mini itself I'd set it to a resolution mode that most closely corresponds to what the TV can display. If it can display 1080p, then set the mini's display resolution to 1680 x 1050.

I have a image at the top of my screen?

I have a image at the top of my screen I want to remove causes a line down the screen

Hello dottieb
I would be happy to help! What image is it? Which device do you have? Did this start after an app was downloaded?
Joe_VZW
Please follow us on twitter @VZWSupport

When I open my iPhone the image on the top is to connect has itune I makes them and I made a restoration(catering) and nothing works. I have the new version of itune also I to download them directly of apple

When I open my iPhone the image on the top is to connect has itune I makes them and I made a restoration(catering) and nothing works. I have the new version of itune also I to download them directly of apple

See this support document http://support.apple.com/kb/HT1808. It may be necessary to do this more than one time. Your device is in recovery mode.

How to Create a "FAQ" page where the top of page has all the Hyperlinks

Hi,
On iWeb, how do I Create a "FAQ" page where the top of page has all the Questions as Hyperlinks.
The hyperlinks would not actually link to a separate page, but would automatically scroll the page to the spot where the question is answered.
An good example is below:
http://www.cardrunners.com/members/index.php?option=com_content&task=view&id=102 &Itemid=2
Thanks for your help!

Sarah,
As is pointed out what you would like to do is old fashioned Anchors, real easy on a conventional site but not so easy in iWeb.
I made an FAQ by just making questions followed by answers and increasing font size and using bold to make the questions stand out so it is easy to use.
Much more work for you but will approximate what you are trying to achieve is this: On the FAQ page make your list of questions each of which you will make into a hyperlink to go to another page. For every question add a blank page to write the answer on. Uncheck the relevant box so that that page does not appear in the navigation bar. Write your answer on that page then under it make a hyperlink back to the FAQ page. The page would also by default have the normal navigation menu at the top, but adding a "Close Window" or "Back To FAQ" link that is actually just a hyperlink to the FAQ page is helpful for site visitors.
While a lot of work to make the extra pages it should work well and solve your problem.
The simplicity of iWeb soon provides problems as soon as you want to do more than the basics offered.

To display the typ, key field,info in the top-of -page event in OO ALV

Hi all,
I need to display the heading and the other select option details in the top-of-page event in ooalv.How can the key ,typ and the info of top of event in alv grid be passed in ooalv grid display.
Regards,
Arpita

Check the blog.
TOP_OF_PAGE in ALV Using CL_GUI_ALV_GRID
Now you have to use the method ADD_TEXT to populate the Select options details.
I hope you know the Function to get the selection details
RS_REFRESH_FROM_SELECTOPTIONS,. it will give into a table. so use that table and populate the TOP_OF_PAGE uisng the class CL_DD_DOCUMENT.

How to print the top of page part along with the ALV list and generate PDF

HI all,
         I have created one ALV by using oops concept .
         and also am able to get the top of page where I have One standard logo on the right hand side
         and some details on the left side .
           Now my requirement is to while printing the list the logo and other top of page details should appear
           In the PDF output but currently while am pressing the print preview button only the alv data is coming
          am already using the method
    handle_top_of_page
      FOR EVENT print_top_of_page
             OF cl_gui_alv_grid,
may be am missing something ... How to get the top of page along with the logo printed ?

Hi Surya,
After generating the grid display click on print button,
a spool number is generated. capture the spool number and convert it to pdf using the fm:
CONVERT_ABAPSPOOLJOB_2_PDF and save the file
Hope this will solve your problem.
Regards,
R K.

How to capture the current info in the top-of-page event in Reuse block dis

How to capture the current info in the top-of-page event in Reuse block dis

Hi Geetha,
     If you don't have any information to pass the Heading Block, then why you are using this event ?
     please comment/ remove that TOP_OF_PAGE code. and use subtotal code in field catalog block.
      you can use below code for subtotal.
      FORM field_catalog .
                gs_fcat-do_sum = &2.
          fcat : 'WRBTR' '15' 'X' ' ' ' ' 'WRBTR' 'Amount',
       ENDFORM.
       Regards,
       Kunjan

How to give colors to the top-of-page in ALV List Display

how to give colors to the top-of-page in ALV List Display....

Check this blog.........
It provides your required output...........
/people/vijaybabu.dudla/blog/2006/07/21/topofpage-in-alv-using-clguialvgrid
See the point 7 for complete code...
Regards,
Pavan

Display of date range in the top-of-page of report

have a question like this.
i have a date range selection on the selection screen where the user will enter the range from this to this.
now whatever period he will enter,that range should be displayed on the output of the report in the top-of page.
can we do like this.
plz explain.
thanks!

Hi,
Use the below logic.
data:      events      type slis_t_event,
      event       type slis_alv_event,
      heading     type slis_t_listheader,
      hline       type slis_listheader,
start-of-selection.
"get the data into the internal table and fill your fieldcatalog table.
then fill the event ... ie top of page like this.
CLEAR event.
event-name = slis_ev_top_of_page.
event-form = form_name.
APPEND event TO events.
then fill the comments to display in the top of page event.
DATA: text(50).
CLEAR hline.
hline-typ = 'H'.
hline-info = "report title".
APPEND hline TO heading.
CLEAR: hline,text.
read table s_pernr index 1.
IF s_pernr-low IS NOT INITIAL.
    WRITE: 'Sal Code:' TO text.
    WRITE: s_pernr-low TO text+15.
ENDIF.
IF s_pernr-high IS NOT INITIAL.
    WRITE: 'to' TO text+25.
    WRITE: s_pernr-high TO text+28.
ENDIF.
hline-typ = 'S'.
hline-info = text.
APPEND hline TO heading.
and then...
CALL FUNCTION 'REUSE_ALV_GRID_DISPLAY'
   EXPORTING
     i_callback_program                = sy-repid
     it_fieldcat                       = ist_fcat[]
      it_events                         = events[]
    TABLES
      t_outtab                          = ist_main[]
   EXCEPTIONS
     program_error                     = 1
     OTHERS                            = 2
IF sy-subrc <> 0.
    MESSAGE ID sy-msgid TYPE sy-msgty NUMBER sy-msgno
            WITH sy-msgv1 sy-msgv2 sy-msgv3 sy-msgv4.
ENDIF.
and then create a subroutine for top of page.
FORM top_of_page.
CALL FUNCTION 'REUSE_ALV_COMMENTARY_WRITE'
    EXPORTING
      it_list_commentary       = heading[]
      I_LOGO                   =
      I_END_OF_LIST_GRID       =
      I_ALV_FORM               =
ENDFORM.                    "TOP_OF_PAGE
regards,
Santosh Thorat

How to write strings with an underline on the TOP-OF-PAGE of ALV

How to write strings with an underline on the TOP-OF-PAGE of ALV

if u r using classes and methods it can be done
but if u r using normal fms and then u have to use HTML_TOP_OF_PAGE but the drawback for this it cannot be printed when the report is printed .

If the program has a write statement at the top & the TOP-OF-PAGE

Q] We know that START-OF-SELECTION is triggered by the 1st writr statement. Now if the program has a write statement at the top & the TOP-OF-PAGE too is written explicitly which also contains write statements-----what will be the effect?

Hi,
i will order of events
see first of all initialization event gets triggred and then at selection screen triggres and then it goes to start of selection and if it found any list processing statement then it goes to top-of -page event and after executing all the statements it returns back to the start of selection event
just i will give one test case to u execute it u will know one thing
give one write statement in the initialization event and in the start of selection of give one write statement see what happns u can find different different things just try i will expalin u the concept..
plzz reward if it is useful...
plzz dont forget to reward..
if u want any concepts u can contact me on [email protected]
plzz reward

How i can show the selection screen input field in the top of page in alv

hi ,
          how i can show the selection screen input field in the top of page in alv grid output.
tell me the process

Hi,
excample from my program:
FORM topof_page.
DATA: l_it_header   TYPE TABLE OF slis_listheader WITH HEADER LINE,
        l_info        LIKE l_it_header-info.
DATA: l_it_textpool TYPE TABLE OF textpool WITH HEADER LINE.
DATA: l_key LIKE l_it_textpool-key.
READ TEXTPOOL c_repid INTO l_it_textpool LANGUAGE sy-langu.
DEFINE m_selinfo.
    if not &1 is initial.
      clear l_it_header.
      l_it_header-typ   = 'S'.
      l_key = '&1'.
      translate l_key to upper case.
      read table l_it_textpool with key key = l_key.
      if sy-subrc = 0.
        shift l_it_textpool-entry left deleting leading space.
        l_it_header-key = l_it_textpool-entry .
      endif.
      loop at &1.
        case &1-option.
          when 'EQ'
            or 'BT'
            or 'CP'.
            write &1-low to l_it_header-info.
          when others.
            write &1-low to l_it_header-info.
            concatenate &1-option
                        l_it_header-info
                   into l_it_header-info
                   separated by space.
        endcase.
        if not &1-high is initial.
          write &1-high to l_info left-justified.
          concatenate l_it_header-info
                      l_info
                 into l_it_header-info
                 separated by space.
        endif.
        if &1-sign = 'E'.
          concatenate ']'
                      l_it_header-info
                 into l_it_header-info.
        endif.
        append l_it_header.
        clear: l_it_header-key,
               l_it_header-info.
      endloop.
    endif.
END-OF-DEFINITION.
m_selinfo: s_trmdat,
             s_trmext,
             s_trmint,
             s_fkdat,
             s_delno,
             s_vbeln,
             s_deact,
             s_kdmat.
CALL FUNCTION 'REUSE_ALV_COMMENTARY_WRITE'
       EXPORTING
            it_list_commentary = l_it_header[].
ENDFORM.
I hope, this will help you.
Regards
Nicole

Using boxes to place images at the top of page

Similar Messages

Maybe you are looking for