Note that there are some explanatory texts on larger screens.

plurals
  1. POCSS formatting a template to get layout working properly
    primarykey
    data
    text
    <p>Hi guys wondering if I could get a little assistance with my site. It is for a uni assignment on e-Business and I have used a template. I have gotten a Javascript code to keep track of amount of items in the basket and cost but I can't get it to display nicely.</p> <p>It is either on the same line as 'Shopping Cart' or if I use <code>&lt;br&gt;</code> goes well below the header menu section.</p> <p><a href="http://i.imgur.com/PjX4VtB.png" rel="nofollow">http://i.imgur.com/PjX4VtB.png</a> to give you an idea of what I mean</p> <p>Code for header.php</p> <pre><code> &lt;h1 id="logo"&gt;&lt;a href="index.html"&gt;Pet Accessories&lt;/a&gt;&lt;/h1&gt; &lt;!-- Cart --&gt; &lt;div id="cart"&gt; &lt;a href="managecart.html" class="cart-link" &gt;Your Shopping Cart&lt;/a&gt; &lt;br /&gt; &lt;script language="javascript" &gt; if ( Cart_is_empty()) { document.write('Your cart is empty.'); } else { Print_total_products(true); document.write(', '); Print_total(true); } &lt;/script&gt; &lt;/div&gt; &lt;!-- End Cart --&gt; &lt;!-- Navigation --&gt; &lt;div id="navigation"&gt; &lt;ul&gt; &lt;li&gt;&lt;a href="index.html" class="active"&gt;Home&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;About Us&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Contact&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;!-- End Navigation --&gt; </code></pre> <p>Code for relevant style.css</p> <pre><code> #header { height:64px; background:url(images/header.gif); position:relative;} #navigation { float:right; white-space:nowrap; } #navigation ul{ list-style-type: none; height:64px; font-weight: bold; float:left;} #navigation ul li{ float:left; display:inline; } #navigation ul li a{ float:left; height:64px; line-height:64px; text-decoration: none; color:#fff; padding:0 15px;} #navigation ul li a.active, #navigation ul li a:hover{ background:#fff; color:#8b0000; } #cart { float:right; width:160px; top:0; right:0; height:51px; background:#8b0000; color:#fff; padding:13px 10px 0 10px; white-space:nowrap; line-height:38px;} a.cart-link { color:#fff; background:url(images/cart-link.gif) no-repeat 0 0; padding:0 0 0 32px; text-decoration: none;} a.cart-link:hover { text-decoration: underline;} #sidebar { float:left; width:226px;} #content { float:right; width:724px;} #main { padding:10px 0 0 0; } </code></pre> <p>I have tried to provide as much information as possible, any help would be greatly appreciated. I don't know if I need to modify the .css file or use another type of <code>&lt;br&gt;</code> to get my text to show in right spot.</p> <p>Thanks</p> <p>Jamie</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload