Wrox Programmer Forums
|
BOOK: Beginning ASP.NET 3.5 : in C# and VB BOOK ISBN: 978-0-470-18759-3
This is the forum to discuss the Wrox book Beginning ASP.NET 3.5: In C# and VB by Imar Spaanjaars; ISBN: 9780470187593
Welcome to the p2p.wrox.com Forums.

You are currently viewing the BOOK: Beginning ASP.NET 3.5 : in C# and VB BOOK ISBN: 978-0-470-18759-3 section of the Wrox Programmer to Programmer discussions. This is a community of software programmers and website developers including Wrox book authors and readers. New member registration was closed in 2019. New posts were shut off and the site was archived into this static format as of October 1, 2020. If you require technical support for a Wrox book please contact http://hub.wiley.com
 
Old April 14th, 2010, 04:20 PM
Registered User
 
Join Date: Apr 2010
Posts: 9
Thanks: 0
Thanked 0 Times in 0 Posts
Question page 221 - problems with Monochrome and dark grey css

Hi,
I have 2 problems at page 221:
1. when i apply the dark grey css - final page does not look like yours
-content text does come in the center
- sidebar comes right of "Hi there visitor ...." text line, not in the upper most right of the page as shown. but in line with menu goes here.
-the content text seems to be kind of under menu goes here on the final ouput.

i check the id in the css and made sure that they match.

2. when i apply Monochrome -
- the HeaderLink - seems to be repeating twice
- the side bar is to the right of content but then to the right of side bar there is some space that i dont see in yours.

please help.
thanks,
Sarala vasudevan
saralav@hotmail.com

Last edited by sarala; April 14th, 2010 at 04:23 PM.. Reason: i forgot to add the 2 problem
 
Old April 14th, 2010, 04:42 PM
Imar's Avatar
Wrox Author
 
Join Date: Jun 2003
Posts: 17,089
Thanks: 80
Thanked 1,576 Times in 1,552 Posts
Default

Hi there,

Hard to say without seeing your code. Can you post the final HTML and the CSS?

Imar
__________________
Imar Spaanjaars
http://Imar.Spaanjaars.Com
Follow me on Twitter

Author of Beginning ASP.NET 4.5 : in C# and VB, Beginning ASP.NET Web Pages with WebMatrix
and Beginning ASP.NET 4 : in C# and VB.
Did this post help you? Click the button below this post to show your appreciation!
 
Old April 14th, 2010, 09:53 PM
Registered User
 
Join Date: Apr 2010
Posts: 9
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Hi,
My 1st problem with DarkGrey css is solved. i get the correct page as seen in yours.
The problem was because of some slight spelling (caps) differences, once that got corrected the problem was fixed.

However after i corrected the id to match the selector id, Monochrome is behaving differently, it now gets it sidebar, under the content on the left side.

HTML Code is:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head><link href="App_Themes/Monochrome/Monochrome.css" type="text/css" rel="stylesheet" /><link href="App_Themes/Monochrome/Monochromesara.css" type="text/css" rel="stylesheet" /><link href="App_Themes/Monochrome/Monochrometest.css" type="text/css" rel="stylesheet" /><title>
Home Page
</title><link href="App_Themes/Monochrome/Monochrome.css" type="text/css" rel="stylesheet" /><link href="App_Themes/Monochrome/Monochromesara.css" type="text/css" rel="stylesheet" /><link href="App_Themes/Monochrome/Monochrometest.css" type="text/css" rel="stylesheet" /></head>
<body>
<form name="aspnetForm" method="post" action="Default.aspx" id="aspnetForm">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTEwMDUyNjYzMjhkZPV/DDsoMdLzRrdEleUT7NNqE1k9" />
</div>


<div id="PageWrapper">
<div id="Header"><a href="./" class="HeaderLink"></a></div>
<div id ="MenuWrapper">Menu goes here</div>
<div id="MainContent">

<h1>Hi there visitor welcome to Planet Wrox.</h1>

<p class="Introduction">
We're glad you're paying a visit to <a href="http://www.PlanetWrox.com">www.PlanetWrox.com</a>,
the coolest music community site on the internet.
</p>
<p class="Introduction">
Feel free to have a <a href="Default.aspx">look around</a>, as there are lots of interesting <b>reviews and concert</b>
pictures to be found here.
</p>
<p class="Introduction"><a href="Login.aspx">You can log in here</a></p>


</div>
<div id="Sidebar"> Side bar goes here</div>
<div id="Footer"> foooter goes here</div>
</div>


</form>
</body>
</html>

and
Monochrome.css is:
*
{
font-family: Arial, Sans-Serif;
}

body
{
/*
Clears white space around the body except for the top which gets 10 pixels.
*/
margin: 10px 0 0 0;
}

a
{
/*
Clears the underline on normal links, and give them #308462 as the color.
*/
color: #308462;
text-decoration: none;
}

a:hover
{
/*
Underlines links when the users hover the mouse over them.
*/
text-decoration: underline;
}

h1
{
/*
Makes h1 elements smaller than their browser default.
*/
font-size : 20px;
}

.Introduction
{
font-style: italic;
color: #003399;
}

#PageWrapper
{
/*
Sets the total width for the entire page.
*/
width: 844px;
background-color: #cccccc;
}

#Header
{
/*
Gives the header the same width as the PageWrapper. The height creates some room for the logo
that is set with the background-image.
*/
background-image: url(Images/Header.jpg);
width: 844px;
height: 86px;
}

.HeaderLink
{
/*
The #HeaderLink is nested in the #Header. It provides a link to the homepage.
*/
width: 844px;
height: 86px;
display: block;
}

#MenuWrapper
{
/*
The menu spans the page width, right below the header.
At the top and left a few pixels padding is applied to create some room.
*/
background-image: url(Images/MenuBackground.jpg);
width: 827px;
height: 36px;
padding-top: 7px;
padding-left: 17px;
}

#MenuWrapper a
{
/*
Links in the Menu are white. This gets overriden by styles in chapter 7.
*/
color: #fff;
}

.MainMenu
{
/*
The Menu gets a white border on all four sides.
*/
border: 1px solid white;
width: 814px;
height: 19px;
background-color : #cccccc;
}


#MainContent
{
/*
Defines the main content area. The #MainContent element has a minimum height of 500 pixels, but can grow if necessary.
The font-size is 80% of its parenty element, which in this case comes down to 80% of the font
the user has specified as the default font in the browser.

*/
font-size: 0.8em;
width:659px;
border-left: 1px solid white;
border-right: 2px solid white;
float: left;
background-color: #e1e1e1;
min-height: 500px;
padding: 10px;
}




#Sidebar
{
/*
The SideBar is positioned to the right of the MainContent area. It gets the same font-size as #MainContent
and gets a background image called Sidebar.jpg. To ensure the image is visible in (most) browsers
on a dmall page, the element gets a minimum height of 500px. This is ignored by IE 6.
*/

font-size: 0.8em;
background-image: url(Images/Sidebar.jpg);
background-repeat: no-repeat;
background-color: #cccccc;
width: 152px;
min-height: 500px;
padding-top: 10px;
padding-left: 10px;
float: left;
}



#Footer
{
/*
The footer is positioned below all other content (yet still within PageWrapper).
At the top, it gets a border with a dashed style, while all other sides have no border.
clear: both is used to clear the impact of the float properties used for #MainContent and #SideBar.
*/
clear: both;
height: 37px;
background-color : #bee4cf;
color: White;
text-align: center;
font-size: 0.7em;
font-weight: bold;
line-height: 37px;
}


thanks,
sarala
 
Old April 15th, 2010, 03:04 AM
Imar's Avatar
Wrox Author
 
Join Date: Jun 2003
Posts: 17,089
Thanks: 80
Thanked 1,576 Times in 1,552 Posts
Default

Hi there,

Take a look at your <head /> section: there are multiple CSS files listed. Maybe one of those is messing up the layout? Try removing all the css files from the App_Themes folder, except for the correct one.

If I copy and paste your HTML and CSS to a new HTML page, things look as they should, so it has to be one of those other CSS files.

Cheers,

Imar
__________________
Imar Spaanjaars
http://Imar.Spaanjaars.Com
Follow me on Twitter

Author of Beginning ASP.NET 4.5 : in C# and VB, Beginning ASP.NET Web Pages with WebMatrix
and Beginning ASP.NET 4 : in C# and VB.
Did this post help you? Click the button below this post to show your appreciation!
 
Old April 15th, 2010, 07:07 AM
Registered User
 
Join Date: Apr 2010
Posts: 9
Thanks: 0
Thanked 0 Times in 0 Posts
Default thank you....the problem got fixed

Yup, those multiple css were causing the problem.
However my question to you....i did not refer these css in the web.config file.
i referenced only the needed css, so why do i see the other css too in the head section?

thank you,
sarala
 
Old April 15th, 2010, 04:51 PM
Imar's Avatar
Wrox Author
 
Join Date: Jun 2003
Posts: 17,089
Thanks: 80
Thanked 1,576 Times in 1,552 Posts
Default

As described in the book, each .css file in the active theme's folder is injected into the page automatically.

Cheers,

Imar
__________________
Imar Spaanjaars
http://Imar.Spaanjaars.Com
Follow me on Twitter

Author of Beginning ASP.NET 4.5 : in C# and VB, Beginning ASP.NET Web Pages with WebMatrix
and Beginning ASP.NET 4 : in C# and VB.
Did this post help you? Click the button below this post to show your appreciation!
 
Old April 15th, 2010, 04:55 PM
Registered User
 
Join Date: Apr 2010
Posts: 9
Thanks: 0
Thanked 0 Times in 0 Posts
Thumbs up thank you.....

.......thank you.
i love this book.
sarala
will keep working on it, until the end.
 
Old April 16th, 2010, 02:35 AM
Imar's Avatar
Wrox Author
 
Join Date: Jun 2003
Posts: 17,089
Thanks: 80
Thanked 1,576 Times in 1,552 Posts
Default

Quote:
i love this book.
...
will keep working on it, until the end.
Excellent. Good to hear you like it. Spread the word, Spread the word ;-)

Cheers,

Imar
__________________
Imar Spaanjaars
http://Imar.Spaanjaars.Com
Follow me on Twitter

Author of Beginning ASP.NET 4.5 : in C# and VB, Beginning ASP.NET Web Pages with WebMatrix
and Beginning ASP.NET 4 : in C# and VB.
Did this post help you? Click the button below this post to show your appreciation!





Similar Threads
Thread Thread Starter Forum Replies Last Post
Beginning MX 2004 pg. 221 Beth Ellen Dreamweaver (all versions) 3 May 14th, 2005 06:12 AM





Powered by vBulletin®
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
Copyright (c) 2020 John Wiley & Sons, Inc.